React Ant Design Admin Template 🚀

A live, public preview of React + Ant Design + Tailwind v4 content management template with flexible theme customization.

🔗 Live Demo

https://crmtemplatexxx.netlify.app

---

📋 About

This demo showcases a complete dashboard/admin template inspired by Ant Design's flexible theme system, transformed into a ready-to-use CRM template. Perfect for rapid development without worrying about layout design, sidebar management, or page overflow handling.

✨ Key Features

• 🔐 Authentication Pages - Login, register, forgot password layouts
• 📊 Advanced Data Tables - Sorting, pagination & filtering capabilities
• 📈 Interactive Dashboards - Charts & graphs with ECharts integration
• 📝 Multi-step Forms - Wizard-style form components
• 🌗 Flexible Theme System - Theme switcher & custom color presets
• 🎨 Complete Layout Solution - Pre-built sidebar, navigation, and responsive design

---

🛠️ Tech Stack

Core Dependencies

• React - Frontend framework
• Ant Design - UI component library
• Tailwind CSS - Utility-first CSS framework
• Redux Toolkit - State management
• Redux Persist - State persistence
• Day.js - Date manipulation library

Soft Dependencies (Replaceable with little effort)

• TanStack Query - API state management
• ECharts - Interactive charts and graphs
• Lodash - Utility functions

---

🎯 Template Purpose

This is a visual demonstration template designed for:

• Fast project initialization
• Complete layout system (sidebar, navigation, page overflow handling)
• Theme customization showcase
• Design pattern reference
• UI/UX flow demonstration

Note: This template provides layout designs and UI components. Authentication pages are layout-only - developers need to implement their own authentication logic. Demo accepts any credentials for visual demonstration purposes.

---

🎨 Theme Customization

The standout feature of this template is its flexible theme customization system inherited from Ant Design's theming capabilities:

• Dynamic color schemes
• Light/dark mode toggle
• Custom color presets
• Real-time theme switching
• Persistent theme preferences

---

🏗️ Architecture

API Layer

• TanStack Query for API management (easily replaceable)

• Fake API implementation using Promise + setTimeout

• Easy to replace with real API endpoints

State Management

• Redux Toolkit for global state

• Redux Persist for state persistence across sessions

Styling

• Tailwind v4 for utility classes

• Ant Design for component theming

• Seamless integration between both systems

---

🚀 Getting Started

1. Clone or download the template
2. Install dependencies - All major libraries pre-configured
3. Customize theme - Use built-in theme customization
4. Replace fake APIs - Swap demo APIs with real endpoints
5. Build your features - Layout and foundation ready

---

📁 What's Included

Pages & Components

• Authentication page layouts (Login, Register, Password Reset)

• Dashboard with interactive charts

• Data tables with advanced features

• Multi-step form wizards

• Settings and profile pages

Layout System

• Responsive sidebar navigation

• Header with user menu

• Breadcrumb navigation

• Page content wrapper

• Mobile-friendly design

Theme System

• Theme provider setup

• Color customization panel

• Mode switcher component

• Preset theme options

---

🎯 Use Cases

Perfect for building:

• Admin Dashboards
• CRM Systems
• Content Management Systems
• Analytics Platforms
• Business Applications

---

💡 Benefits

• Zero layout concerns - Complete responsive layout system
• Instant setup - Pre-configured with essential libraries
• Theme flexibility - Easy customization without CSS expertise
• Production ready - Optimized build configuration
• Developer friendly - Clean code structure and organization

---

Built for developers who want to focus on business logic, not layout complexities.