---
name: "@utilcn"
slug: "utilcn"
description: "Fullstack shadcn registry focused on backend utility scaffolding for Next.js/TypeScript projects rather than visual components. Provides: string helpers (camelCase, kebab-case, PascalCase, snake_case, capitalize, truncate, reverse), S3-style file storage utilities with presigned upload/download URL builders plus ready-made React upload/download components and hooks, a ChatGPT MCP widget bundle (frontend UI, build tooling, shared hooks/types, backend server scaffold, sample MCP tool), and a Zod-powered server environment validator for typesafe env configuration. Free and open-source. Use for: bootstrapping the backend plumbing of a new full-stack app — file uploads, AI widget scaffolding, and typed secrets — without reinventing the boilerplate."
category: "Hooks/utilities"
tags: ["ai", "components", "forms", "hooks", "loaders", "media"]
framework: "react"
license: null
author: "BrennenRocks"
website: "https://utilcn.dev"
github: "https://github.com/BrennenRocks/utilcn"
registry: "https://utilcn.dev/r/registry.json"
pro: false
pro_url: null
github_stars: 15
component_count: 17
generated_at: "2026-07-28T08:00:50.948Z"
---

# @utilcn

Fullstack shadcn registry focused on backend utility scaffolding for Next.js/TypeScript projects rather than visual components. Provides: string helpers (camelCase, kebab-case, PascalCase, snake_case, capitalize, truncate, reverse), S3-style file storage utilities with presigned upload/download URL builders plus ready-made React upload/download components and hooks, a ChatGPT MCP widget bundle (frontend UI, build tooling, shared hooks/types, backend server scaffold, sample MCP tool), and a Zod-powered server environment validator for typesafe env configuration. Free and open-source. Use for: bootstrapping the backend plumbing of a new full-stack app — file uploads, AI widget scaffolding, and typed secrets — without reinventing the boilerplate.

## Links

- Website: https://utilcn.dev
- GitHub: https://github.com/BrennenRocks/utilcn
- Registry JSON: https://utilcn.dev/r/registry.json
- Directory page: https://sh4dcn.vercel.app/registry/utilcn
- This file: https://sh4dcn.vercel.app/md/utilcn.md

## Install

```sh
# add the whole registry (shadcn CLI)
npx shadcn@latest add https://utilcn.dev/r/registry.json
pnpm dlx shadcn@latest add https://utilcn.dev/r/registry.json
bunx shadcn@latest add https://utilcn.dev/r/registry.json
# clone the source repo
git clone https://github.com/BrennenRocks/utilcn.git
# fetch the raw registry index
curl -s https://utilcn.dev/r/registry.json
```

## Components (17)

| name | type | description | install |
| --- | --- | --- | --- |
| capitalize-all | registry:lib | Capitalize the first letter of every word in a string. | `npx shadcn@latest add https://utilcn.dev/r/capitalize-all.json` |
| capitalize | registry:lib | Capitalize the first letter of a string. | `npx shadcn@latest add https://utilcn.dev/r/capitalize.json` |
| repeat-pad | registry:lib | Repeat a string until it reaches the desired length. | `npx shadcn@latest add https://utilcn.dev/r/repeat-pad.json` |
| reverse-string | registry:lib | Reverse a string. | `npx shadcn@latest add https://utilcn.dev/r/reverse-string.json` |
| to-camel-case | registry:lib | Convert a string to camelCase. | `npx shadcn@latest add https://utilcn.dev/r/to-camel-case.json` |
| to-kebab-case | registry:lib | Convert a string to kebabCase. | `npx shadcn@latest add https://utilcn.dev/r/to-kebab-case.json` |
| to-pascal-case | registry:lib | Convert a string to PascalCase. | `npx shadcn@latest add https://utilcn.dev/r/to-pascal-case.json` |
| to-snake-case | registry:lib | Convert a string to snake_case. | `npx shadcn@latest add https://utilcn.dev/r/to-snake-case.json` |
| truncate-string | registry:lib | Truncate a string to a given length. | `npx shadcn@latest add https://utilcn.dev/r/truncate-string.json` |
| generate-presigned-download-url | registry:lib | Generate a presigned download URL for a file. | `npx shadcn@latest add https://utilcn.dev/r/generate-presigned-download-url.json` |
| generate-presigned-upload-url | registry:lib | Generate a presigned upload URL for a file. | `npx shadcn@latest add https://utilcn.dev/r/generate-presigned-upload-url.json` |
| download-file | registry:component | Download a file from a storage provider using a presigned download URL. | `npx shadcn@latest add https://utilcn.dev/r/download-file.json` |
| upload-file | registry:component | Upload a file to a storage provider using a presigned upload URL. | `npx shadcn@latest add https://utilcn.dev/r/upload-file.json` |
| env-server | registry:file | Environment variable validation schema using Zod for server configuration | `npx shadcn@latest add https://utilcn.dev/r/env-server.json` |
| upload-multiple-files | registry:component | Upload multiple files to a storage provider using a presigned upload URL. | `npx shadcn@latest add https://utilcn.dev/r/upload-multiple-files.json` |
| chatgpt-app | registry:block | Frontend widget implementation, build script, types, and hooks for embedding a ChatGPT MCP widget. | `npx shadcn@latest add https://utilcn.dev/r/chatgpt-app.json` |
| chatgpt-app-backend | registry:block | MCP server bootstrap, widget asset builder, and tool registration for the ChatGPT widget. | `npx shadcn@latest add https://utilcn.dev/r/chatgpt-app-backend.json` |

## For AI agents

```text
You are adding components from @utilcn to a shadcn-compatible project.
1. Read this file (https://sh4dcn.vercel.app/md/utilcn.md) for the component list.
2. Fetch the machine-readable index: https://utilcn.dev/r/registry.json
3. Install a single component with its install command from the table above.
4. Full structured record: https://sh4dcn.vercel.app/json (library slug: utilcn).
```