A powerful, browser-based CSV toolkit — drag, split, merge, resize. No server. No sign-up. Your data never leaves the browser.
Built with Next.js and deployable on Vercel for free.
An interactive CSV editor with a spreadsheet-like feel.
| Feature | Details |
|---|---|
| Drag columns | Grab the ⠿ grip in any column header and drag left/right to reorder |
| Drag rows | Grab the ⠿ grip on the left of any row and drag up/down to reorder |
| Resize columns | Toggle "Resize cols" in the top bar, then drag the right edge of any column header |
| Bulk select | Checkboxes on every row and column header; top-left checkbox selects all rows |
| Delete | Hover any row/column to reveal an × button, or bulk-delete selected items |
| Undo / Redo | Every edit is tracked — ⌘Z to undo, ⌘⇧Z to redo. Arrows in the top bar |
| Rename file | Click the filename in the top bar to edit it inline (Google Docs-style) |
| Export | Downloads the current state (with all your reorders and deletes) as a CSV |
Split one large CSV into multiple smaller files and download them all as a ZIP.
Two split modes:
Equal intervals — give a row count and a file prefix:
data_001.csv → rows 1 – 25
data_002.csv → rows 26 – 50
data_003.csv → rows 51 – 75
...
Live preview shows every filename and row range before you generate.
Custom chunks — name each chunk and assign exact row counts:
ROOM-710 → 25 rows (1 – 25)
ROOM-711-B → 34 rows (26 – 59)
ROOM-712 → 40 rows (60 – 99)
...
- Tab on the last row to add the next chunk automatically
- Row ranges update live as you type
- Progress bar shows assigned vs total rows
- Over-limit rows are flagged in red
Options:
- Toggle to include or exclude the header row in each generated file
- Downloads as a single
.zip
Combine multiple columns into a single merged column with full control over formatting.
How it works:
- Select columns — click chips to pick columns; click again to deselect
- Set merge order — drag the selected chips to change which column comes first
- Choose a format:
| Format control | Example |
|---|---|
| Separator presets | Space · Comma , · Pipe | · Dash - · None · Custom |
| Prefix & Suffix | Prefix [ + Pipe + Suffix ] → [ John | Doe | NYC ] |
| Template editor | Type freely using {Column Name} placeholders |
| Column palette | Click any {Column Name} chip to insert it at the cursor |
| Reset | "Reset to builder" reconnects the template to the separator/prefix/suffix builder |
- Output settings — set the new column name; toggle to remove the original columns
- Live preview — see merged output for the first 5 rows before downloading
- Downloads as a single merged CSV
| Library | Purpose |
|---|---|
| Next.js 15 | App Router, static export, free Vercel hosting |
| TypeScript | Full type safety |
| Tailwind CSS v4 | Utility-first styling, dark premium design |
| @dnd-kit | Accessible drag-and-drop for columns, rows, and chips |
| PapaParse | CSV parsing and CSV generation |
| JSZip | ZIP bundling for the Splitter tool |
| Lucide React | Icons |
| clsx | Conditional classname utility |
npm install
npm run devOpen http://localhost:3000.
/ → Tool selector (choose Studio, Splitter, or Merger)
/studio → CSV Studio
/split → CSV Splitter
/merge → Column Merger
This project is a fully static Next.js app — no backend, no environment variables.
- Push to GitHub
- Import at vercel.com/new
- Click Deploy — done
Desktop only. On screens narrower than 1024 px a friendly gate asks you to switch to a desktop browser.