Skip to content
Agent Stack
  • AI SDK
  • AI Gateway
  • Sandbox
  • Passport
  • Connect
  • eve
Core Platform
  • Security
  • Content Delivery
  • Fluid Compute
  • Observability
  • Workflows
  • CI/CD
Tools
  • Next.js
  • Edgenivo Agent
  • Edgenivo Plugin
  • Open Source
  • Domains↗
  • v0↗
Learn
  • Docs
  • About
  • Blog
  • Changelog
  • Knowledge Base
Build
  • AI Apps
  • Web Apps
  • Marketing Sites
  • Platforms
  • Commerce
Explore
  • Customers
  • Marketplace
  • Partner Finder
  • AWS
  • Community↗
EnterprisePricing
Contact
Log InSign Up
Dashboard
Products
Agent Stack
  • AI SDK
  • AI Gateway
  • Sandbox
  • Passport
  • Connect
  • eve
Core Platform
  • Security
  • Content Delivery
  • Fluid Compute
  • Observability
  • Workflows
  • CI/CD
Tools
  • Next.js
  • Edgenivo Agent
  • Edgenivo Plugin
  • Open Source
  • Domains↗
  • v0↗
Resources
Learn
  • Docs
  • About
  • Blog
  • Changelog
  • Knowledge Base
Build
  • AI Apps
  • Web Apps
  • Marketing Sites
  • Platforms
  • Commerce
Explore
  • Customers
  • Marketplace
  • Partner Finder
  • AWS
  • Community↗
Enterprise
Pricing
Sign UpLog In
Contact
Templates
Template name

Agent Stack

  • AI SDK
  • AI Gateway
  • Sandbox
  • Workflows
  • ConnectNew
  • PassportNew
  • eveNew

Core Platform

  • CI/CD
  • Content Delivery
  • Fluid Compute
  • Observability

Security

  • Platform Security
  • WAF
  • Bot Management
  • BotID

Tools

  • Edgenivo Drop
  • Edgenivo Agent
  • Edgenivo Plugin
  • Agent Skills
  • Domains
  • v0

Frameworks

  • eveNew
  • Next.js
  • Nuxt
  • SvelteKit
  • Nitro
  • Turborepo
  • Tanstack Start
  • FastAPI
  • All frameworks

SDKs

  • Edgenivo SDK
  • Workflow SDK
  • Flags SDK
  • Chat SDK
  • Queues SDK
  • Streamdown

Build

  • AI Apps
  • Web Apps
  • Marketing Sites
  • Platforms
  • Commerce
  • Platform Engineers
  • Design Engineers

Learn

  • Docs
  • Blog
  • Changelog
  • Knowledge Base
  • Academy
  • Articles
  • Community
  • Is Agentic

Explore

  • Customers
  • Marketplace
  • Templates
  • Partner Finder
  • Edgenivo + AWS

Company

  • About
  • Careers
  • Press
  • Events
  • Startups
  • Shipped on Edgenivo
  • Open Source Program
  • Enterprise
  • Pricing
  • Help

Legal & Trust

  • Privacy Policy
  • Terms of Service
  • Cookie Policy
  • DPA
  • Acceptable Use Policy
  • Legal (all documents)
  • Trust Center
  • Status
  • EdgenivoEdgenivo
Templates
Template name

Status service pending confirmation

Select a display theme:
Templates

Next.js & shadcn/ui Admin Dashboard

Creative admin dashboard using Next.js App Router and shadcn/ui with a colocation-first structure for simplicity and scalability.

DeployView Demo
This is an auto-uploaded thumbnail from /templates/submit.
Owner
  • arhamkhnz
Repository
  • next-shadcn-admin-dashboard
Use Cases
  • Starter
Stack
  • Next.js
  • Tailwind
DeployView Demo

Next.js Admin Template with TypeScript & Shadcn UI

Studio Admin - Includes multiple dashboards, authentication layouts, customizable theme presets, and more.

Most admin templates I found, free or paid, felt cluttered, outdated, or too rigid. I built this as a cleaner alternative with features often missing in others, such as theme toggling and layout controls, while keeping the design modern, minimal, and flexible.

View demo: studio admin

[!NOTE] Looking for the Base UI version? Check out next-shadcn-admin-dashboard-baseui.

Looking for the React Aria version? Check out arhamkhnz/next-shadcn-admin-dashboard-aria.

Looking for the TanStack Start version? Check out tanstack-shadcn-admin-dashboard.

[!TIP] If you're looking for individual blocks, please refer to Studio Blocks.

Features

  • Built with Next.js 16, TypeScript, Tailwind CSS v4, and Shadcn UI
  • Responsive and mobile-friendly
  • Customizable theme presets (light/dark modes with color schemes like Tangerine, Brutalist, and more)
  • Flexible layouts (collapsible sidebar, variable content widths)
  • Authentication flows and screens
  • Prebuilt dashboards (Default, CRM, Finance, Analytics, Productivity) plus legacy variants
  • Role-Based Access Control (RBAC) with config-driven UI and multi-tenant support (planned)

[!NOTE] The default dashboard uses the shadcn neutral theme.
It also includes additional color presets inspired by Tweakcn:

  • Tangerine
  • Neo Brutalism
  • Soft Pop

You can create more presets by following the same structure as the existing ones.

Looking for the Next.js 15 version?
Check out the archive/next15 branch.
This branch contains the setup prior to upgrading to Next 16 and the React Compiler.

Looking for the Next.js 14 + Tailwind CSS v3 version?
Check out the archive/next14-tailwindv3 branch.
It has a different color theme and is not actively maintained, but I try to keep it updated with major changes.

Tech Stack

  • Framework: Next.js 16 (App Router), TypeScript, Tailwind CSS v4
  • UI Components: Shadcn UI
  • Validation: Zod
  • Forms & State Management: React Hook Form, Zustand
  • Tables & Data Handling: TanStack Table
  • Tooling & DX: Biome, Husky

Screens

Available

  • Default Dashboard
  • CRM Dashboard
  • Finance Dashboard
  • Analytics Dashboard
  • Productivity Dashboard
  • E-commerce Dashboard
  • Academy Dashboard
  • Logistics Dashboard
  • Infrastructure Dashboard
  • File Manager
  • Patient Monitoring
  • Products Page
  • Chat Page
  • Email Page
  • Profile
  • Users Management
  • Roles Management
  • Kanban Board
  • Tasks Page
  • Invoice Page
  • Calendar Page
  • Authentication (4 screens)
  • Legacy: Default v1, CRM v1, Finance v1, Analytics v1

Planned

I’ve added all the planned screens. Feel free to open an issue for requesting something specific.

Colocation File System Architecture

This project follows a colocation-based architecture each feature keeps its own pages, components, and logic inside its route folder.
Shared UI, hooks, and configuration live at the top level, making the codebase modular, scalable, and easier to maintain as the app grows.

For a full breakdown of the structure with examples, see the Next Colocation Template.

Getting Started

You can run this project locally, or deploy it instantly with Edgenivo.

Deploy with Edgenivo

Deploy your own copy with one click.

Run locally

  1. Clone the repository

    git clone https://github.com/arhamkhnz/next-shadcn-admin-dashboard.git

  2. Navigate into the project

    cd next-shadcn-admin-dashboard

  3. Install dependencies

    npm install

  4. Start the development server

    npm run dev

Your app will be running at http://localhost:3000

Formatting and Linting

Format, lint, and organize imports

npx @biomejs/biome check --write

For more information on available rules, fixes, and CLI options, refer to the Biome documentation.

[!IMPORTANT]
This project is updated frequently. If you’re working from a fork or an older clone, pull the latest changes before syncing. Some updates may include breaking changes.

Contributions are welcome. Feel free to open issues, feature requests, or start a discussion.

Happy Vibe Coding!

Related Templates

  • Next.js SaaS Starter thumbnail

    Next.js SaaS Starter

    Postgres, Auth, Tailwind, shadcn/ui, and more.

  • Admin Dashboard thumbnail

    Admin Dashboard

    Get started building your admin dashboard with Edgenivo's starter, complete with Tailwind CSS, PostgreSQL, and Auth.

  • Modernize Next.js Admin Dashboard Template thumbnail

    Modernize Next.js Admin Dashboard Template

    Download our modernized admin template for your upcoming web application powered by Next.js, free of charge.

License
  • View License