UploadKit
File uploads for developers. Beautifully.
Open-source TypeScript SDK + 40+ premium React components + managed storage on Cloudflare R2 — with BYOS (Bring Your Own Storage) mode so you can use your own S3, R2, GCS, or Backblaze B2 bucket. 5 GB free forever.
Website · Docs · Dashboard · Changelog
Quickstart — add to an existing project
Most people land here with a Next.js app already running. Three steps:
pnpm add @uploadkitdev/react @uploadkitdev/nextCreate app/api/uploadkit/[...uploadkit]/route.ts:
import { createUploadKitHandler, type FileRouter } from '@uploadkitdev/next';
const router = {
default: { maxFileSize: '4MB', allowedTypes: ['image/*'] },
} satisfies FileRouter;
export const { GET, POST } = createUploadKitHandler({
router,
apiKey: process.env.UPLOADKIT_API_KEY!,
});Wrap the root layout and drop in a dropzone:
// app/layout.tsx
import { UploadKitProvider } from '@uploadkitdev/react';
// <UploadKitProvider endpoint="/api/uploadkit">{children}</UploadKitProvider>
// any page
import { UploadDropzone } from '@uploadkitdev/react';
// <UploadDropzone route="default" />
