Introduction

What is Zenith Dashboard?

Zenith Dashboard is a feature-rich admin template designed for building internal tools, SaaS applications, and back-office dashboards. It provides a solid foundation with pre-built components, pages, and patterns so you can focus on shipping your product instead of building boilerplate UI. With five dashboard variations, 20+ app pages, a live Theme Customizer, i18n support, Storybook component browser, and a comprehensive set of auth and error pages, it covers every scenario a modern admin panel needs out of the box.

Features

• Next.js 16 + React 19 + TypeScript 5 + Tailwind CSS v4 — App Router with server and client components, strict typing, and utility-first styling with OKLCh color tokens
• 5 Dashboard Variations — Overview, Analytics, eCommerce, CRM, and SaaS dashboards, each with unique layouts and chart compositions
• 10+ App Pages — Chat, Mail, Files, Kanban, Calendar, Wizard, Orders, Products, Customers, Invoices, Billing, Profile, Settings, Support, and Pricing pages with full interactivity
• Charts Showcase — Area, Bar, Pie, Radar, RadialBar, Treemap, Scatter, and Composed charts powered by Recharts
• Theme Customizer — Live drawer panel with 6 color presets (Default, Ocean, Sunset, Forest, Berry, Slate), 3 density levels (Compact, Default, Comfortable), dark/light/system theme, and persistent preferences
• Layout Options — Sidebar (default) or horizontal top-nav layout, plus fluid (full-width) or boxed (max-width centered) container modes
• RTL Support — Full right-to-left language support for Arabic, Hebrew, Persian, and more, toggled via the Theme Customizer
• 35+ shadcn/ui Components — Vendored, accessible, and fully customizable primitives built on Radix UI with CVA variants
• TanStack Table — Sortable, filterable, paginated data tables with CSV export and mobile-responsive card views
• Auth Pages — Sign-in, sign-up, forgot password, reset password, two-factor authentication, email verification, and lock screen templates
• Error Pages — 404 Not Found, 403 Forbidden, 500 Server Error, Coming Soon, and Maintenance pages
• Command Palette (Cmd+K) — Quick navigation and search across all pages and actions
• Drag-and-Drop Kanban — Interactive task board with draggable cards across columns
• Framer Motion Page Transitions — Smooth animated transitions between routes and interactive UI elements
• React Hook Form + Zod Validation — Type-safe form handling with schema-based validation across all form pages
• Vitest + Playwright Testing — Unit and component testing with Vitest, end-to-end testing with Playwright
• Internationalization (i18n) — Built-in locale system with English, German, and French translations, localStorage persistence, and a locale switcher in Settings and Theme Customizer
• User Management & RBAC — Full CRUD user pages with roles (Admin, Editor, Viewer, Moderator), permissions grid, department filters, and status management
• Storybook Component Browser — 15 interactive stories across UI primitives, form components, and dashboard widgets for visual development and testing
• Performance Optimizations — Lazy-loaded charts with IntersectionObserver, next/dynamic code splitting, and bundle analyzer integration
• Seed/Starter Version — A minimal, stripped-down starter project with all infrastructure (theming, i18n, layouts, 33 UI components) but no demo pages or mock data
• Fully Responsive — Collapsible sidebar, mobile-first layout, and touch-friendly interactions across 125+ static routes

Quick Start

Get up and running in under a minute:

git clone https://github.com/colorlib/zenith-dashboard.git
cd zenith-dashboard
npm install
npm run dev

Then open http://localhost:3737 in your browser.

Tech Stack

Next Steps

Ready to dive in? Continue with the Installation Guide for detailed setup instructions, or explore the Folder Structure to understand the project layout.