Case study · Open source · Developer tools · shadcn/ui registry
UploadCN
Production-ready file uploads, built for shadcn.
npx shadcn@latest add @uploadcn/file-uploadOverview
What it is
Open-source upload components and blocks for shadcn/ui, with a tested upload engine underneath: queues, retries, chunked and resumable uploads, presigned S3 and R2, Cloudinary, virus scanning and OCR. You install the UI as source code with the shadcn CLI; the hard parts ship as small npm packages.
My role
Solo creator: design, engineering, docs, release pipeline and launch film.
By the numbers
Built to be dropped into real apps
- Blocks30 of them animated
- 58
- Automated tests
- 1,400+
- npm packages
- 3
- Licensed
- MIT
Works with all 8 shadcn styles, 3 bases (Radix, Base UI, React Aria) and 5 icon libraries.
What I built
The hard parts, solved once
- 01
Upload engine
Concurrency, retries with backoff, multipart and resumable uploads, pause and resume, offline recovery.
- 02
Storage adapters
S3, R2, Cloudinary, local disk, any custom API, or browser-only for forms.
- 03
Server package
Presigned upload routes, virus scanning (ClamAV, VirusTotal) and OCR (Google Vision, AWS Textract, Azure, Mistral, Tesseract).
- 04
shadcn registry
Compiled for every style and base, with icons converted to the user's library on install.
- 05
Docs site
90 live examples, SEO and AI-friendly llms.txt.
- 06
Automated releases
Changesets, a release PR, then npm publish with provenance on merge.
Trust
Distribution you can verify
Accepted into the official shadcn registry directory in October 2026. Developers install with npx shadcn@latest add @uploadcn/<component>, with no setup. View PR (opens in a new tab)
npm releases are published from GitHub Actions with npm provenance.
Stack
Tools behind it
- TypeScript
- React 19
- Next.js 16
- Tailwind CSS v4
- shadcn/ui
- Turborepo
- pnpm
- Fumadocs
- Vitest
- Playwright
- Changesets
- GitHub Actions
- Netlify
Links
Try it yourself
- Live siteuploadcn.dev (opens in a new tab)
- Documentationuploadcn.dev/docs (opens in a new tab)
- Live examplesuploadcn.dev/examples (opens in a new tab)
- Source on GitHubgithub.com/uploadcn/uploadcn (opens in a new tab)
- @uploadcn/react on npmnpmjs.com/package/@uploadcn/react (opens in a new tab)
- All packages on npmnpmjs.com/org/uploadcn (opens in a new tab)
- shadcn registry directoryui.shadcn.com/docs/directory (opens in a new tab)
- Directory listing PRgithub.com/shadcn-ui/ui/pull/12281 (opens in a new tab)
Need something built with this level of care?
I take products from idea to production.