# UploadCN

> Composable upload primitives, hooks and complete upload experiences for shadcn/ui, with queues, retries, chunked and resumable uploads, presigned S3/R2 and accessible UI. UploadCN is a shadcn registry (namespace `@uploadcn`) plus three npm packages: `@uploadcn/core` (framework-agnostic upload engine), `@uploadcn/react` (hooks and headless primitives) and `@uploadcn/server` (signing routes).

Components work with every shadcn style (vega, nova, maia, lyra, mira, luma, sera, rhea), every base (Radix, Base UI, React Aria), every theme and every icon library. Storage is pluggable: S3, R2, Cloudinary, local disk, any API (`createAdapter`) or browser-only (`localAdapter`).

Server extras: virus scanning in the upload route (`@uploadcn/server/scan`: ClamAV, VirusTotal, any HTTP scanner) and OCR (`@uploadcn/server/ocr`: Google Vision, AWS Textract, Azure Document Intelligence, Mistral, your own service; `tesseractOcr` in the browser). Add the OCR route with `npx shadcn@latest add @uploadcn/ocr-route`.

## Use the registry

- Add the namespace (style-aware): `npx shadcn@latest registry add @uploadcn=https://uploadcn.dev/r/{style}/{name}.json`
- Install a component: `npx shadcn@latest add @uploadcn/file-upload`
- Registry index (all items, for agents and the shadcn MCP server): https://uploadcn.dev/r/registry.json
- Item JSON: https://uploadcn.dev/r/{name}.json (Nova) or https://uploadcn.dev/r/{style}/{name}.json (e.g. `base-lyra`)
- MCP: run `npx shadcn@latest mcp init --client claude`, then ask "show me the components in the @uploadcn registry"
- Configure storage once with `npx shadcn@latest add @uploadcn/upload-config` and wrap the app in `<UploadConfig>`

## Core components

- [Upload](https://uploadcn.dev/r/upload.json): Composable, accessible upload primitives: dropzone, trigger, queue, previews, progress, status and actions. Install: `npx shadcn@latest add @uploadcn/upload`
- [Image Cropper](https://uploadcn.dev/r/image-cropper.json): A crop, zoom, rotate and flip dialog that outputs a processed image file. Install: `npx shadcn@latest add @uploadcn/image-cropper`

## Hooks

- [useCropQueue](https://uploadcn.dev/r/use-crop-queue.json): Turns a crop dialog into an async step so images can be cropped before they upload. Install: `npx shadcn@latest add @uploadcn/use-crop-queue`
- [useCamera](https://uploadcn.dev/r/use-camera.json): Streams the device camera into a video element and captures frames as Files. Starts only on demand. Install: `npx shadcn@latest add @uploadcn/use-camera`

## Blocks

- [File Upload](https://uploadcn.dev/r/file-upload.json): A dropzone with a full upload queue, progress summary and batch actions. Install: `npx shadcn@latest add @uploadcn/file-upload`
- [Upload Button](https://uploadcn.dev/r/upload-button.json): A single button that uploads and reports progress inline. Install: `npx shadcn@latest add @uploadcn/upload-button`
- [Image Upload](https://uploadcn.dev/r/image-upload.json): An image grid with optional cropping and client-side compression. Install: `npx shadcn@latest add @uploadcn/image-upload`
- [Avatar Upload](https://uploadcn.dev/r/avatar-upload.json): A profile photo uploader with round cropping and a progress ring. Install: `npx shadcn@latest add @uploadcn/avatar-upload`
- [Gallery Upload](https://uploadcn.dev/r/gallery-upload.json): A photo gallery uploader that resizes images to WebP before upload. Install: `npx shadcn@latest add @uploadcn/gallery-upload`
- [Video Upload](https://uploadcn.dev/r/video-upload.json): Video uploads with inline playback, duration limits and resumable multipart for large files. Install: `npx shadcn@latest add @uploadcn/video-upload`
- [Audio Upload](https://uploadcn.dev/r/audio-upload.json): Audio uploads with an inline player per file. Install: `npx shadcn@latest add @uploadcn/audio-upload`
- [Document Upload](https://uploadcn.dev/r/document-upload.json): Document, PDF and résumé uploads with type badges. Install: `npx shadcn@latest add @uploadcn/document-upload`
- [Chat Attachments](https://uploadcn.dev/r/chat-attachments.json): An AI chat composer with attachments via click, drag and paste. Install: `npx shadcn@latest add @uploadcn/chat-attachments`
- [Document Ingest](https://uploadcn.dev/r/document-ingest.json): RAG / knowledge-base ingestion with parse, chunk, embed and index stages. Install: `npx shadcn@latest add @uploadcn/document-ingest`
- [Global Upload](https://uploadcn.dev/r/global-upload.json): An app-wide upload provider with a drop-anywhere overlay, a background queue panel and IndexedDB persistence. Install: `npx shadcn@latest add @uploadcn/global-upload`
- [Upload Field](https://uploadcn.dev/r/upload-field.json): A form field for react-hook-form, TanStack Form and server actions. Install: `npx shadcn@latest add @uploadcn/upload-field`
- [Upload Dialog](https://uploadcn.dev/r/upload-dialog.json): Pick files, review them, then upload in a modal that confirms before closing mid-upload. Install: `npx shadcn@latest add @uploadcn/upload-dialog`
- [Upload Table](https://uploadcn.dev/r/upload-table.json): The upload queue as a data table, with a drop overlay over the whole table. Install: `npx shadcn@latest add @uploadcn/upload-table`
- [Upload Tabs](https://uploadcn.dev/r/upload-tabs.json): One queue fed from three sources: the device, a public link or the camera. Install: `npx shadcn@latest add @uploadcn/upload-tabs`
- [Camera Upload](https://uploadcn.dev/r/camera-upload.json): Take photos with the device camera and upload them as you go, with a file picker fallback. Install: `npx shadcn@latest add @uploadcn/camera-upload`
- [Logo Upload](https://uploadcn.dev/r/logo-upload.json): A settings card for a workspace logo with light and dark previews. Install: `npx shadcn@latest add @uploadcn/logo-upload`
- [Image Metadata](https://uploadcn.dev/r/image-metadata.json): Images upload in the background while people write alt text and captions. Install: `npx shadcn@latest add @uploadcn/image-metadata`
- [Upload Popover](https://uploadcn.dev/r/upload-popover.json): Attachments behind a toolbar button with a count and a progress ring. Install: `npx shadcn@latest add @uploadcn/upload-popover`
- [Product Media Upload](https://uploadcn.dev/r/product-media-upload.json): Storefront product photos: a cover image and a gallery you reorder by drag or keyboard. Install: `npx shadcn@latest add @uploadcn/product-media-upload`
- [CSV Import](https://uploadcn.dev/r/csv-import.json): Bulk import from a spreadsheet, with column checks and a preview before upload. Install: `npx shadcn@latest add @uploadcn/csv-import`
- [Identity Verification](https://uploadcn.dev/r/identity-verification.json): KYC-style ID front, back and selfie with a progress rail and submit gate. Install: `npx shadcn@latest add @uploadcn/identity-verification`
- [Document Checklist](https://uploadcn.dev/r/document-checklist.json): A checklist of required documents (claims, onboarding, visas) ticked off as they upload. Install: `npx shadcn@latest add @uploadcn/document-checklist`
- [Job Application Upload](https://uploadcn.dev/r/job-application-upload.json): Resume, cover letter and portfolio for a careers page. Install: `npx shadcn@latest add @uploadcn/job-application-upload`
- [OCR Upload](https://uploadcn.dev/r/ocr-upload.json): Upload scans, photos and PDFs and read their text with any OCR engine, with copy, download and extracted fields. Install: `npx shadcn@latest add @uploadcn/ocr-upload`
- [Receipt Upload](https://uploadcn.dev/r/receipt-upload.json): Expense capture: a receipt plus details your OCR can prefill (merchant, date, amount). Install: `npx shadcn@latest add @uploadcn/receipt-upload`
- [Property Photos](https://uploadcn.dev/r/property-photos.json): Real-estate listing photos tagged by room, with coverage and a recommended count. Install: `npx shadcn@latest add @uploadcn/property-photos`
- [Assignment Submission](https://uploadcn.dev/r/assignment-submission.json): Coursework hand-in with a deadline, late flag, and turn in / unsubmit. Install: `npx shadcn@latest add @uploadcn/assignment-submission`

## Files (routes and config)

- [Upload Config](https://uploadcn.dev/r/upload-config.json): Configure storage once: an UploadConfigProvider wrapper for your root layout that every UploadCN component uses. Install: `npx shadcn@latest add @uploadcn/upload-config`
- [Upload Route (Next.js)](https://uploadcn.dev/r/upload-route.json): A Next.js route handler that signs S3 or R2 uploads at /api/upload. Install: `npx shadcn@latest add @uploadcn/upload-route`
- [OCR Route (Next.js)](https://uploadcn.dev/r/ocr-route.json): A Next.js route handler at /api/ocr that reads text with Google Vision, Textract, Azure, Mistral or your own service. Install: `npx shadcn@latest add @uploadcn/ocr-route`
- [Upload Route (TanStack Start)](https://uploadcn.dev/r/upload-route-tanstack.json): A TanStack Start server route that signs S3 uploads at /api/upload. Install: `npx shadcn@latest add @uploadcn/upload-route-tanstack`

## Animated blocks

- [Folder Upload](https://uploadcn.dev/r/folder-upload.json): A folder that opens on hover and drag; dropped files fly in and the front shows progress. Install: `npx shadcn@latest add @uploadcn/folder-upload`
- [Upload Stack](https://uploadcn.dev/r/upload-stack.json): Uploads stacked like notifications that fan out on hover or focus. Install: `npx shadcn@latest add @uploadcn/upload-stack`
- [Morphing Upload Button](https://uploadcn.dev/r/upload-morph-button.json): A button that morphs into its own progress bar, then a check mark. Install: `npx shadcn@latest add @uploadcn/upload-morph-button`
- [Polaroid Upload](https://uploadcn.dev/r/polaroid-upload.json): Photos drop onto the table like polaroids with a spring and a tilt. Install: `npx shadcn@latest add @uploadcn/polaroid-upload`
- [Animated Upload Queue](https://uploadcn.dev/r/animated-upload-queue.json): A queue whose rows expand in, collapse out, count up and draw a check. Install: `npx shadcn@latest add @uploadcn/animated-upload-queue`
- [Ripple Dropzone](https://uploadcn.dev/r/ripple-dropzone.json): A dropzone whose rings ripple while dragging, with a burst on drop. Install: `npx shadcn@latest add @uploadcn/ripple-dropzone`
- [Upload Island](https://uploadcn.dev/r/upload-island.json): A Dynamic Island-style pill that morphs between idle, progress and done, and expands into the file list on hover. Install: `npx shadcn@latest add @uploadcn/upload-island`
- [Image Reveal Upload](https://uploadcn.dev/r/image-reveal-upload.json): A single-image uploader where the photo develops behind a scan line as it uploads. Install: `npx shadcn@latest add @uploadcn/image-reveal-upload`
- [Liquid Dropzone](https://uploadcn.dev/r/liquid-dropzone.json): A dropzone that fills up like a glass with the combined upload progress. Install: `npx shadcn@latest add @uploadcn/liquid-dropzone`
- [Progress Ring Upload](https://uploadcn.dev/r/progress-ring-upload.json): One ring for the whole batch: a counting percentage, per-file ticks and a self-drawing check. Install: `npx shadcn@latest add @uploadcn/progress-ring-upload`
- [Upload Dock](https://uploadcn.dev/r/upload-dock.json): A macOS-style dock of uploaded files that magnifies under the cursor. Install: `npx shadcn@latest add @uploadcn/upload-dock`
- [Upload Terminal](https://uploadcn.dev/r/upload-terminal.json): Uploads printed as a CLI log with ASCII progress bars, speed and results. Install: `npx shadcn@latest add @uploadcn/upload-terminal`
- [Magnetic Dropzone](https://uploadcn.dev/r/magnetic-dropzone.json): A dropzone whose target leans towards the pointer and follows dragged files. Install: `npx shadcn@latest add @uploadcn/magnetic-dropzone`
- [Envelope Upload](https://uploadcn.dev/r/envelope-upload.json): Files slide into an envelope; the flap closes and a seal stamps on when sent. Install: `npx shadcn@latest add @uploadcn/envelope-upload`
- [Paper Plane Button](https://uploadcn.dev/r/paper-plane-button.json): A send button that fills with progress, then the paper plane takes off. Install: `npx shadcn@latest add @uploadcn/paper-plane-button`
- [Shopping Bag Upload](https://uploadcn.dev/r/shopping-bag-upload.json): Product photos drop into a shopping bag that fills as they upload. Install: `npx shadcn@latest add @uploadcn/shopping-bag-upload`
- [Orbit Upload](https://uploadcn.dev/r/orbit-upload.json): Files orbit the center while uploading and land in a row when done. Install: `npx shadcn@latest add @uploadcn/orbit-upload`
- [Upload Confetti](https://uploadcn.dev/r/upload-confetti.json): Drop into any Upload: a confetti burst in your theme's colors when a batch finishes. Install: `npx shadcn@latest add @uploadcn/upload-confetti`
- [Upload Odometer](https://uploadcn.dev/r/upload-odometer.json): Files, megabytes and percent on rolling odometer digits. Install: `npx shadcn@latest add @uploadcn/upload-odometer`
- [Cloud Dropzone](https://uploadcn.dev/r/cloud-dropzone.json): Particles rise into a cloud that fills with the upload progress. Install: `npx shadcn@latest add @uploadcn/cloud-dropzone`
- [Flip Card Upload](https://uploadcn.dev/r/flip-card-upload.json): A single-file card that flips to show the uploaded file. Install: `npx shadcn@latest add @uploadcn/flip-card-upload`
- [Scanner Upload](https://uploadcn.dev/r/scanner-upload.json): A document scanner frame with corner guides and a scan beam, for IDs and receipts. Install: `npx shadcn@latest add @uploadcn/scanner-upload`
- [Vinyl Upload](https://uploadcn.dev/r/vinyl-upload.json): A record that spins while tracks upload, with a tonearm that follows progress. Install: `npx shadcn@latest add @uploadcn/vinyl-upload`
- [Rocket Upload](https://uploadcn.dev/r/rocket-upload.json): A rocket that climbs with the upload and lifts off when it's done. Install: `npx shadcn@latest add @uploadcn/rocket-upload`
- [Battery Upload](https://uploadcn.dev/r/battery-upload.json): Charges cell by cell for backups, with a bolt that pulses while it charges. Install: `npx shadcn@latest add @uploadcn/battery-upload`
- [Typewriter Upload](https://uploadcn.dev/r/typewriter-upload.json): Types each file name onto a page that rolls out of the machine. Install: `npx shadcn@latest add @uploadcn/typewriter-upload`
- [Hourglass Upload](https://uploadcn.dev/r/hourglass-upload.json): Sand runs through an hourglass as files upload, with the time left up front. Install: `npx shadcn@latest add @uploadcn/hourglass-upload`
- [Blueprint Upload](https://uploadcn.dev/r/blueprint-upload.json): A drawing traces itself as CAD files upload, then the title block is approved. Install: `npx shadcn@latest add @uploadcn/blueprint-upload`
- [Stamp Upload](https://uploadcn.dev/r/stamp-upload.json): Documents land on a pile and get stamped the moment they're received. Install: `npx shadcn@latest add @uploadcn/stamp-upload`
- [Delivery Upload](https://uploadcn.dev/r/delivery-upload.json): A truck carries files from the warehouse to their destination as they upload. Install: `npx shadcn@latest add @uploadcn/delivery-upload`

## Docs

# Documentation

- [Introduction](/docs): Production-ready file uploads, built for shadcn.
- [Installation](/docs/installation): Add UploadCN to a shadcn project.
- [Getting Started](/docs/getting-started): From zero to a production upload UI in a few lines.
- [How it works](/docs/how-it-works): The engine, the lifecycle and the layers on top.
- [Packages & dependencies](/docs/packages): Why UploadCN is part npm package, part copied source, and what you actually install.
- [Styles & theming](/docs/theming): Every component follows your shadcn design system, all 8 styles, every base color and theme, your icon library, font and radius.
- [Registry, MCP & AI](/docs/registry): Use UploadCN from the shadcn CLI, the shadcn MCP server, and any coding agent.

- **Components**
- [Upload](/docs/components/upload): Composable, accessible parts for building any upload interface, dropzones, lists, items, progress and actions.
- [Image Cropper](/docs/components/image-cropper): A crop, zoom, rotate and flip dialog that outputs a processed image file.

- **Blocks**
- [File Upload](/docs/components/file-upload): A dropzone with a full upload queue, progress summary and batch actions.
- [Upload Button](/docs/components/upload-button): A single button that uploads and reports progress inline.
- [Upload Dialog](/docs/components/upload-dialog): The classic "Upload files" modal: add files, review the list, then upload with one button.
- [Upload Popover](/docs/components/upload-popover): Attachments behind a button, for toolbars, comment boxes and tickets. The trigger shows a count and a progress ring while files upload.
- [Upload Table](/docs/components/upload-table): The upload queue as a data table, name, type, size, status and progress in columns. Drop files anywhere on the table.
- [Upload Tabs](/docs/components/upload-tabs): One uploader, three sources: the device, a public link or the camera. Files from every tab land in the same queue.
- [Upload Field](/docs/components/upload-field): An upload field for react-hook-form, TanStack Form and server actions.
- [Image Upload](/docs/components/image-upload): An image grid with optional cropping and client-side compression.
- [Avatar Upload](/docs/components/avatar-upload): A profile photo uploader with round cropping and a progress ring.
- [Gallery Upload](/docs/components/gallery-upload): A photo gallery uploader that resizes images to WebP before upload.
- [Logo Upload](/docs/components/logo-upload): A settings card for a workspace or company logo, with live previews on light and dark backgrounds.
- [Image Metadata](/docs/components/image-metadata): Images upload in the background while people write alt text and captions. Saving waits for every upload and, by default, every description.
- [Camera Upload](/docs/components/camera-upload): Take photos with the device camera and upload them as you go, with a file picker fallback when there's no camera or access is denied.
- [Video Upload](/docs/components/video-upload): Video uploads with inline playback, duration limits and resumable multipart for large files.
- [Audio Upload](/docs/components/audio-upload): Audio uploads with an inline player per file.
- [Document Upload](/docs/components/document-upload): Document, PDF and résumé uploads with type badges.
- [Chat Attachments](/docs/components/chat-attachments): An AI chat composer with attachments via click, drag and paste.
- [Document Ingest](/docs/components/document-ingest): RAG and knowledge-base ingestion with parse, chunk, embed and index stages.
- [OCR Upload](/docs/components/ocr-upload): Upload scans, photos and PDFs and read their text with any OCR engine, with copy, download and extracted fields.
- [Global Upload](/docs/components/global-upload): An app-wide upload provider, a drop-anywhere overlay and a background queue panel.
- [Product Media](/docs/components/product-media-upload): Product photos for a storefront: the first image is the cover, the rest a gallery you reorder by dragging or with the keyboard.
- [CSV Import](/docs/components/csv-import): Bulk import from a spreadsheet. The CSV is read in the browser, required columns are checked and the first rows previewed, before anything uploads.
- [Identity Verification](/docs/components/identity-verification): KYC-style identity check: a slot for each document, a progress rail, and a submit button that unlocks once every required document is uploaded.
- [Document Checklist](/docs/components/document-checklist): Collect a list of documents, insurance claims, onboarding, visas, loans. Each requirement is its own slot and ticks off when its file uploads.
- [Job Application](/docs/components/job-application-upload): A careers-page application: resume (required), cover letter and portfolio (optional), and a link. Files upload while the candidate fills in the rest.
- [Receipt Upload](/docs/components/receipt-upload): Expense capture: snap or drop a receipt, fill in the details, or let your OCR do it, and submit.
- [Property Photos](/docs/components/property-photos): Listing photos for real estate and rentals: tag each photo with a room, see which rooms are still missing, and aim for the recommended count.
- [Assignment Submission](/docs/components/assignment-submission): Coursework hand-in, like a learning platform: attach work, turn it in, unsubmit to make changes. Shows the deadline and flags late work.

- **Animated**
- [Folder Upload](/docs/components/folder-upload): A folder that opens as you hover or drag files over it. Dropped files fly in, and the folder's front shows the upload progress.
- [Upload Island](/docs/components/upload-island): A Dynamic Island for uploads: a pill that morphs between idle, uploading and done, and expands into the file list on hover.
- [Envelope](/docs/components/envelope-upload): Send documents like mail: files slide into the envelope, the flap closes, and a seal stamps on when everything has arrived.
- [Paper Plane Button](/docs/components/paper-plane-button): A send button with a payoff: it fills while files upload, then the paper plane takes off and the label lands on "Sent".
- [Shopping Bag](/docs/components/shopping-bag-upload): For storefronts and marketplaces: product photos drop into a shopping bag, the counter bounces, and the bag fills as they upload.
- [Orbit](/docs/components/orbit-upload): Files orbit the center while they upload, each with its own progress ring, and land in a tidy row when finished.
- [Upload Stack](/docs/components/upload-stack): Uploads stacked like notifications. Hover or focus the stack to fan it out; the newest file stays on top.
- [Morphing Button](/docs/components/upload-morph-button): A button that becomes its own progress bar while uploading, then a check mark. No extra UI needed.
- [Polaroid Upload](/docs/components/polaroid-upload): Photos drop onto the table like polaroids, with a spring, a tilt, and a lift on hover.
- [Image Reveal](/docs/components/image-reveal-upload): A single-image uploader where the photo develops as it uploads, blurred and grey at first, revealed sharp behind a scan line that follows the progress.
- [Liquid Dropzone](/docs/components/liquid-dropzone): A dropzone that fills up like a glass. The liquid level is the combined progress of every file, with a gently moving surface.
- [Progress Ring](/docs/components/progress-ring-upload): One big ring for the whole batch: the percentage counts up in the middle, ticks mark each file, and a check draws itself when everything is done.
- [Upload Dock](/docs/components/upload-dock): A macOS-style dock of uploaded files. Tiles magnify under the cursor, a dot marks files still uploading, and the whole dock is a drop target.
- [Upload Terminal](/docs/components/upload-terminal): Uploads as a CLI log. Drop files on the window and each one prints a line with an ASCII progress bar, speed and result.
- [Magnetic Dropzone](/docs/components/magnetic-dropzone): A dropzone whose target is magnetic: it leans towards the pointer on hover, follows dragged files, and snaps back with a spring.
- [Ripple Dropzone](/docs/components/ripple-dropzone): A dropzone with a pulse: rings ripple out while files are dragged over it, and a burst confirms the drop.
- [Cloud Dropzone](/docs/components/cloud-dropzone): Upload to the cloud, literally: particles rise into the cloud while files upload, and the cloud fills with the progress.
- [Flip Card](/docs/components/flip-card-upload): A single-file card that flips over when the upload finishes, showing the file on its back. Flip it again to upload another.
- [Document Scanner](/docs/components/scanner-upload): A scanner frame for IDs, receipts and contracts: corner guides lock on, a beam sweeps while it uploads, and the frame confirms.
- [Odometer](/docs/components/upload-odometer): Upload stats on rolling digits: files, megabytes and percent tick over like an odometer.
- [Vinyl](/docs/components/vinyl-upload): A spinning record for music and podcast uploads: it spins up while tracks upload, the tonearm follows progress and it coasts to a stop when done.
- [Rocket](/docs/components/rocket-upload): A launch pad for deploys and build artifacts: the rocket climbs with the upload, its engine burns while bytes move and it lifts off when every file lands.
- [Battery](/docs/components/battery-upload): A battery that charges cell by cell for device and photo backups, with a pulsing bolt while charging and a full glow when the backup completes.
- [Typewriter](/docs/components/typewriter-upload): A typewriter for manuscripts and document submissions: each file name is typed onto a page that rolls out of the machine, with its status beside it.
- [Hourglass](/docs/components/hourglass-upload): An hourglass for long uploads and deadlines: sand runs from the top bulb to the bottom with the progress, and the time left is shown front and center.
- [Blueprint](/docs/components/blueprint-upload): A drafting sheet for architecture, engineering and CAD files: a drawing traces itself line by line as files upload and the title block is stamped approved.
- [Stamp](/docs/components/stamp-upload): A pile of paperwork for contracts, filings and HR documents: each document lands on the pile and gets a rubber stamp the moment it is received.
- [Delivery](/docs/components/delivery-upload): A delivery route for shipping manifests, invoices and proof of delivery: a truck carries the files from the warehouse and drops the parcel off on arrival.
- [Confetti](/docs/components/upload-confetti): Drop it inside any <Upload>: when a batch finishes, a burst of confetti in your theme's colors.
- [Animated Queue](/docs/components/animated-upload-queue): A queue in motion: rows expand in and collapse out, percentages count up smoothly, active bars shimmer and finished rows draw a check.

- **Hooks**
- [Hooks](/docs/hooks): React hooks for building upload experiences, from @uploadcn/react.

- **Storage**
- [Choosing storage](/docs/storage): Every component works with every backend. Pick an adapter, configure it once, and switch any time.
- [Cloudinary](/docs/storage/cloudinary): Upload straight from the browser to Cloudinary, unsigned with a preset, or signed by your server. Large files upload in resumable chunks.
- [Local disk](/docs/storage/filesystem): Store uploads on your own server's disk, for self-hosted apps, VPSs and local development.
- [Browser only](/docs/storage/browser): Use the components purely as UI, files stay in the browser, and your form or code decides what to do with them.
- [Custom adapters](/docs/storage/custom): Turn any upload function into an adapter: your API, Supabase, Firebase, Vercel Blob or anything else.

- **Adapters**
- [Adapters](/docs/adapters): The UI doesn't care where files go. Adapters move the bytes.
- [Amazon S3](/docs/adapters/s3): Direct-to-bucket uploads with presigned URLs and resumable multipart.
- [Cloudflare R2](/docs/adapters/r2): Upload directly to R2 through its S3-compatible API.
- [Presigned URLs](/docs/adapters/presigned): Upload to any storage that issues signed URLs or POST policies.
- [Multipart & chunked](/docs/adapters/multipart): A provider-agnostic engine for chunked, parallel, resumable uploads.
- [HTTP](/docs/adapters/http): Upload to any endpoint that accepts files.
- [tus](/docs/adapters/tus): Resumable uploads over the tus protocol.
- [Mock](/docs/adapters/mock): Realistic uploads without a backend, for prototypes, tests and docs.

- **Guides**
- [Presigned uploads](/docs/guides/presigned-uploads): Let the browser upload straight to storage while your server stays in control.
- [Chunked uploads](/docs/guides/chunked-uploads): Split large files into parts that upload in parallel and retry independently.
- [Resumable uploads](/docs/guides/resumable-uploads): Pause, resume, and survive reloads and crashes.
- [Image uploads](/docs/guides/image-uploads): Preview, crop, rotate, resize and compress images in the browser.
- [Validation](/docs/guides/validation): Types, sizes, counts, dimensions, durations, duplicates and custom rules.
- [Forms](/docs/guides/forms): react-hook-form, TanStack Form, native forms and server actions.
- [AI & LLM uploads](/docs/guides/ai-uploads): Chat attachments, multimodal input and RAG document ingestion.
- [Background uploads](/docs/guides/background-uploads): What browsers can really do, and how UploadCN uses it.
- [Offline & reconnection](/docs/guides/offline): Network loss, reconnection and recoverable uploads.
- [Processing & scanning](/docs/guides/processing-and-scanning): Reflect server-side processing and malware scans in the UI.
- [Virus scanning](/docs/guides/virus-scanning): Scan every upload on your server with ClamAV, VirusTotal or your own scanner. Infected files are deleted and shown as rejected.
- [OCR](/docs/guides/ocr): Read text from scans, photos and PDFs with Google Vision, AWS Textract, Azure Document Intelligence, Mistral, Tesseract or your own service.
- [Accessibility](/docs/guides/accessibility): Keyboard, screen readers, focus and motion.
- [Advanced usage](/docs/guides/advanced): Headless usage, events, concurrency, transforms and the render prop.

- **Frameworks**
- [Next.js](/docs/frameworks/nextjs): App Router route handlers, server actions and layouts.
- [TanStack Start](/docs/frameworks/tanstack-start): Server routes and the same components.
- [Vite, React Router & others](/docs/frameworks/react): Use UploadCN in any React app, with any backend.

- **Reference**
- [@uploadcn/core](/docs/reference/core): The framework-agnostic upload engine.
- [@uploadcn/react](/docs/reference/react): Hooks and headless primitives.
- [@uploadcn/server](/docs/reference/server): A Web-standard upload route for S3, R2 and S3-compatible storage.

## Optional

- [Full documentation as one file](https://uploadcn.dev/llms-full.txt)
- [Every page as Markdown](https://uploadcn.dev/llms.mdx/docs/content.md): append `/content.md` to any docs URL under /llms.mdx