The Next.js admin dashboard starter where every feature actually works
Built with Next.js 16, shadcn/ui on Base UI primitives, Tailwind CSS v4, and TypeScript. Production-ready tables, forms, auth, billing, and AI SDK streaming chat. Not static demo screens.
Everything a real admin app needs, already wired
Each feature is a working, production-ready implementation you can copy into your own code as-is.
Data tables that really filter
Server prefetch, client-side React Query cache, and URL-synced search, filtering, sorting, and pagination via nuqs. Interactions stay instant on the client.
Advanced form patterns
TanStack Form + Zod with reusable composable fields, multi-step and dialog/sheet forms, and real create/update mutations with cache invalidation.
Auth & multi-tenant workspaces
Clerk authentication with organizations, team management, roles, and permissions wired end-to-end.
Billing & plan gating
Clerk Billing with subscription plans, a pricing table, and feature gating for plan-only pages.
Real app pages included
Analytics overview, Kanban board, chat, notifications, user management, and profile. All functional, not mocked screenshots.
Six-plus themes
OKLCH theme system with a live switcher, dark mode, and tweakcn-compatible theme files you can extend.
Fourteen working pages out of the box
Every page ships functional: real data flows, real auth, real state. Explore them all in the live demo.
Dashboard overview
Analytics cards and Recharts graphs, with parallel routes giving each section its own loading and error state.
Product list table
TanStack Table with React Query server prefetch, client cache, and URL-synced search, filter, and pagination.
Product form
Create and edit flows built on TanStack Form and Zod, with mutations that invalidate the cache on success.
Users table
User management with the same server prefetch and client-side filtering pattern as products.
Kanban board
Drag-and-drop task board built with dnd-kit and Zustand: column sorting, priority badges, assignees, and due dates.
Chat
Messaging UI with a conversation list, message bubbles, quick replies, and attachments in a responsive multi-panel layout.
Notifications
Notification center with a header badge, popover preview, unread tabs, and mark-as-read actions.
Workspaces & teams
Multi-tenant organizations via Clerk: create, switch, and manage members, roles, and permissions.
Billing & plans
Subscription management with Clerk Billing and a ready-made pricing table.
Plan-gated page
Feature gating with Clerk Protect: plan-only content with a fallback UI for everyone else.
Auth pages
Sign-in and sign-up with passwordless, social logins, and enterprise SSO through Clerk.
Profile
Account management UI for profile and security settings.
React Query demo
A reference page for the server prefetch, HydrationBoundary, and useSuspenseQuery hydration pattern.
Error & not-found pages
A global error page wired to Sentry plus a root-level not-found page.
Most dashboard templates are static screens
They look finished until you wire in real data. This starter takes the opposite approach.
Everything actually works
Tables run end-to-end against a real data layer. Forms validate and mutate with cache invalidation on success. Auth, organizations, and billing function for real, so you evaluate working patterns, not screenshots.
Industry-standard implementations
The data layer follows the official TanStack Query SSR pattern (server prefetch + HydrationBoundary + useSuspenseQuery), typed end to end, organized in a feature-based structure with a clean API layer per feature.
Minimal by design
Deliberately lean, with no bloated boilerplate, so you spend your time tweaking it to your use case, not deleting someone else’s code. The cleanup script strips any feature you do not need in under a minute.
Start minimal in 60 seconds
Most starters make you hand-delete demo pages and rip out dependencies. This one ships with a cleanup script that removes the features you do not need: folders, files, dependencies, docs, and env entries.
- Interactive mode: pick what stays, everything else goes
- Dry-run first, so you can preview every removal
- Replacement files are real, typechecked code
$ bun run cleanup --interactive
? Select features to remove: kanban, chat
✓ kanban removed
✓ chat removed
Folders, files, deps, and docs cleaned up.
Modern tools, no legacy baggage
- Next.js 16
- React 19
- TypeScript
- Tailwind CSS v4
- shadcn/ui
- Base UI
- TanStack Query
- TanStack Form
- TanStack Table
- Zod
- Clerk
- nuqs
- Zustand
- Recharts
- kbar
- Sentry
Frequently asked questions
Is it production ready?
Yes. Every feature is a complete, working implementation: authentication, CRUD flows, table search/filter/sort/pagination, and form validation with mutations all function end-to-end. It is a starting point for real applications, not a visual mockup.
Is it free for commercial use?
Yes. MIT-licensed and free for both personal and commercial projects: no paid tier, no license keys.
Can I use it without Clerk?
Yes. Run bun run cleanup clerk to remove Clerk authentication (along with organizations and billing) and wire in your own auth solution.
How do I remove demo pages or features I do not need?
Run bun run cleanup --interactive and pick what to strip, or bun run cleanup --list to see what can be removed.
Does it support Next.js 16, React 19, and Tailwind CSS v4?
Yes. The template is built on Next.js 16 (App Router), React 19, and Tailwind CSS v4, with shadcn/ui on Base UI primitives, and is actively maintained to track new releases.
Does it work with AI coding assistants?
Yes. The repo ships AGENTS.md and CLAUDE.md with the project conventions, plus a bundled Claude Code skill that teaches agents how to add pages, tables, forms, and navigation the template way. It works with Claude Code, Cursor, and any tool that reads AGENTS.md.
Can I use npm instead of Bun?
Yes. Bun is preferred, but npm works too, and the repo ships both Node.js and Bun Dockerfiles for deployment.
How is this different from other dashboard templates?
Most dashboard templates are static demo boilerplates: screens that look finished but need rebuilding once you wire in real data. Here the tables, forms, auth, organizations, and billing all work end-to-end, the implementations follow official TanStack and Next.js patterns, and a cleanup script keeps the base minimal so you tweak it to your use case instead of deleting code.
What data fetching pattern does it use?
TanStack React Query with the official SSR pattern: prefetchQuery on the server, HydrationBoundary with dehydrate for hydration, useSuspenseQuery on the client, and nuqs for URL-synced search-param state. Mutations invalidate the cache on success.
How do I deploy it?
Deploy to Vercel out of the box, or use the included Docker setups: a Node.js Dockerfile and a Bun Dockerfile, both using Next.js standalone output mode.
Clone it. Strip what you don't need. Ship.
Free and MIT licensed. Your next SaaS dashboard, internal tool, or admin panel starts from working code.
git clone https://github.com/Kiranism/next-shadcn-dashboard-starter.git