React 19 Compatible - A modern, responsive admin dashboard template built with React 19, Bootstrap 5, and comprehensive component library.
ArchitectUI React is a feature-rich, free admin dashboard template designed for modern web applications. Built with the latest React 19 and Bootstrap 5, it provides a solid foundation for creating professional admin panels, dashboards, and web applications.
This template offers clean, responsive design with a comprehensive set of UI components, charts, forms, and layout options. Perfect for startups, enterprises, and developers looking for a production-ready admin dashboard solution.
- React 19.1.0 - Latest React with improved performance and features
- Bootstrap 5.3.7 - Modern CSS framework with utilities
- Redux Toolkit - State management
- React Router v7 - Navigation and routing
- Sass/SCSS - Advanced styling capabilities
- 30+ Ready-to-use Components - Forms, tables, charts, modals, and more
- Multiple Dashboard Layouts - Analytics, CRM, Commerce, Sales, and Minimal
- Advanced Form Elements - Date pickers, file uploads, text editors, sliders
- Data Visualization - ApexCharts, Chart.js, Recharts integration
- Interactive Maps - Google Maps and Vector Maps support
- Responsive Design - Mobile-first approach with all device compatibility
- Flexible Sidebar - Collapsible with custom themes
- Header Variations - Multiple header styles and configurations
- Footer Components - Fixed and dynamic footer options
- Theme Customization - 9 pre-built color schemes
- Dark Mode Support - Professional dark theme option
- Node.js (LTS version) - Download here
- npm or yarn package manager
-
Clone or Download the repository
git clone https://github.com/DashboardPack/architectui-react-theme-free.git cd architectui-react-theme-free -
Install Dependencies
npm install
-
Start Development Server
npm start
The application will open in your browser at
http://localhost:3001
-
Create Production Build
npm run build
-
Serve Production Build Locally
npx serve -s build -l 4000
View the production build at
http://localhost:4000
architectui-react-theme-free/
├── public/ # Static files
├── src/
│ ├── assets/ # Styles, images, and static assets
│ ├── components/ # Reusable UI components
│ ├── DemoPages/ # Demo pages and examples
│ │ ├── Dashboards/ # Dashboard variations
│ │ ├── Components/ # UI component examples
│ │ ├── Forms/ # Form examples
│ │ └── Tables/ # Table examples
│ ├── Layout/ # Layout components
│ │ ├── AppHeader/ # Header components
│ │ ├── AppSidebar/ # Sidebar components
│ │ └── AppFooter/ # Footer components
│ └── reducers/ # Redux store configuration
├── config-overrides.js # Webpack configuration
└── package.json # Dependencies and scripts
| Command | Description |
|---|---|
npm start |
Start development server (port 3001) |
npm run build |
Create production build |
npm test |
Run test suite |
npm run eject |
Eject from Create React App (not recommended) |
ArchitectUI React supports all modern browsers:
- Chrome (latest)
- Firefox (latest)
- Safari (latest)
- Edge (latest)
- Opera (latest)
Customize the color scheme by modifying the Sass variables in:
src/assets/themes/[theme-name]/_variables.scss
Adjust layout settings in:
src/reducers/ThemeOptions.js
Follow the existing component structure in:
src/DemoPages/Components/
ArchitectUI is available in multiple frameworks:
| Framework | Repository | Status |
|---|---|---|
| React | Free Version | ✅ Active |
| Vue.js | Vue Version | ✅ Available |
| Angular | Angular Version | ✅ Available |
| HTML/jQuery | HTML Version | ✅ Available |
Upgrade to ArchitectUI React PRO for additional features:
- 150+ Premium Components
- Advanced Dashboard Layouts
- Premium Chart Libraries
- Extended Form Elements
- Professional Support
- Regular Updates
- Commercial License
DashboardPack.com - Premium admin dashboard templates
- React, Vue, Angular, and HTML versions
- Professional support and documentation
- Regular updates and new features
- Browse Templates
Colorlib.com - Free web templates and themes
- Hundreds of free templates
- Various categories: admin, landing, blog, portfolio
- High-quality designs for every project
- Explore Free Templates
- UI Framework: Bootstrap 5.3.7, Reactstrap 9.2.3
- Charts: ApexCharts 4.7.0, Chart.js 4.4.7, Recharts 2.13.3
- Icons: FontAwesome 6.7.2, React Icons 5.4.0
- Forms: React Hook Form, React Select, React Datepicker
- Animations: Framer Motion 12.19.1, React Animations
- State Management: Redux Toolkit 2.8.2
- Build Tools: React App Rewired, Sass 1.89.2
- Code Splitting - Automatic route-based code splitting
- Tree Shaking - Eliminate unused code
- Optimized Builds - Minified and compressed assets
- Lazy Loading - Components load on demand
We welcome contributions! Please follow these steps:
- Fork the repository
- Create a feature branch (
git checkout -b feature/amazing-feature) - Commit your changes (
git commit -m 'Add amazing feature') - Push to the branch (
git push origin feature/amazing-feature) - Open a Pull Request
This project is licensed under the MIT License - see the LICENSE file for details.
MIT License
Copyright (c) 2023 DashboardPack
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software...
- Documentation: Comprehensive guides and examples included
- GitHub Issues: Report bugs and request features
- Community: Join our developer community
- GitHub: Star the repository for updates
- DashboardPack: Follow for new template releases
- Changelog: Check CHANGELOG.md for version history
Developed by: DashboardPack.com
Design: Professional UI/UX team
Maintained by: Open source community
Made with care for the developer community