Nata Admin — Vue 3 & Tailwind CSS Admin Dashboard Template#

Nata Admin is a clean, modern, and high-performance admin dashboard template crafted with Vue 3 (Composition API & <script setup> ), TypeScript, Vite 8+, Tailwind CSS 3.4+, and a structured SCSS styling layer. Designed with an enterprise-grade mindset, Nata Admin delivers pixel-perfect layouts, responsive typography, and consistent Tabler-inspired color tokens tailored for SaaS, CRM, ERP, E-Commerce, and Analytics web applications.

Developed with care by Appiqa.

Key Features#

• Vue 3 & TypeScript — Modern Composition API architecture with 100% strict TypeScript typing.
• Vite 8+ Build System — Lightning-fast development server with instant HMR and optimized production bundling.
• Tailwind CSS + SCSS Architecture — Utility-first development speed coupled with modular SCSS design tokens.
• 8 Production-Ready Dashboards — Purpose-built layouts for Overview, Analytics, CRM, Finance, HR, E-Commerce, Sales, and Projects.
• 60+ Pre-built Pages & Applications — Complete workflows with tables, forms, kanban, calendar, email, chat, and user management.
• Light & Dark Mode — Beautiful native dark mode toggle with persistent state and automatic transition.
• 5 Sidebar Color Themes — Light, Navy Slate, Deep Indigo, Dark Emerald, and Warm Stone styles.
• Vertical & Horizontal Layout Modes — Flexible navigation structures for desktop, tablet, and mobile.
• ApexCharts Integration — Reusable responsive SVG chart components that synchronize with theme modes.
• Lucide Icon Family — Modern, clean icons via the official maintained @lucide/vue package.
• Mock Data Driven — Works 100% out of the box with zero database or backend configuration required.
• Comprehensive Offline Documentation — Single-file HTML documentation with code snippets and guides.

8 Specialized Dashboard Variants#

• Executive Overview — High-level KPI summary, monthly revenue trajectory, recent transactions, and activity stream.
• Analytics & Web Core — Traffic acquisition, conversion funnel metrics, device usage distribution, and top pages.
• CRM & Lead Tracker — Sales pipeline velocity, deal stages tracker, client opportunities, and lead conversion rate.
• Finance & Accounting — Income vs expense cash flow, bank account balance summary, and recent transaction ledger.
• HR & Workforce — Employee attendance tracker, leave approval management, and department headcounts.
• E-Commerce & Orders — Total gross revenue, order fulfillment status, top selling products, and inventory stock monitor.
• Sales & Pipeline — Sales representative leaderboard, regional quota progress, and revenue target tracking.
• Project Management — Task progress tracker, agile sprint velocity, project timelines, and workload distribution.

Pre-Built Pages Included (60+ Templates)#

• Applications: Email Client, Real-time Chat UI, Interactive Calendar, Kanban Board, Task Manager, File Manager with Storage Stats, Notes App, Contacts Directory.
• E-Commerce: Product Catalog, Product Details, Add / Edit Product, Orders Listing, Order Details View, Customer Profiles, Category Tree.
• CRM: Leads Management, Deals Board, Sales Pipeline, Customer Segmentation Groups, Customer Feedback.
• Finance: Invoices List, Invoice Details & Print View, Transactions Ledger, Payment Methods, Accounting Journal, Department Budgets, Subscriptions.
• Human Resources: Employees Directory, Employee Details, Daily Attendance, Leave Requests & Approvals, Payroll Runs, Performance Reviews, Job Recruitment.
• User & Security: Users List, User Profile, Roles & Permissions Matrix, User Activity History, Audit Logs.
• System & Settings: General Settings, Security & 2FA, Notification Preferences, Appearance & Theme Customizer, API Key Manager, Webhooks, Third-Party Integrations.
• Authentication: Sign In, Sign Up, Forgot Password, Reset Password, 2FA Verification, Lock Screen (Full-page and Modal samples).
• Template Pages: Pricing Table, Frequently Asked Questions (FAQ), Help Center Knowledgebase, Blank Page, 404 Error, 500 Server Error, Maintenance Mode, Coming Soon.
• Components Preview: Live catalog of Buttons, Badges, Modals, Drawers, Forms, Dropdowns, Tables, Charts, and Alert Feedbacks.

Modern Tech Stack#

• Framework: Vue.js 3.5+ (vuejs.org)
• Language: TypeScript 5.8+ (typescriptlang.org)
• Bundler: Vite 8.0+ (vite.dev)
• Utility CSS: Tailwind CSS 3.4+ (tailwindcss.com)
• Style Layer: SCSS (Structured Design Tokens & BEM Component Styles)
• State Management: Pinia 2.3+ (pinia.vuejs.org)
• Routing: Vue Router 4.5+ (router.vuejs.org)

Note / Disclaimer#

Photos, product imagery, and user avatars used in the live preview and demo screenshots are for demonstration purposes only and are not included in the main download package. High-quality placeholder SVGs and vector illustrations (MIT license) are provided out-of-the-box.