ArchitectUI Bootstrap 5 jQuery/HTML Theme FREE

Made with love by DashboardPack.com

ArchitectUI is a Modern Clean Responsive HTML Bootstrap 5 Admin UI Dashboard Template. It is used by thousands of developers to build SaaS and various other admin panels for web apps. This version hosted on Github is for preview only. It has a limited functionality in comparison to Pro version yet it comes with unlimited color schemes and flexibility unmatched to most other Premium admin dashboards.

✨ What's New in v4.2.0

🚀 Complete Modernization

• Latest Dependencies - All npm packages updated to current versions
• Future-Proof SASS - Modern @use syntax, zero deprecation warnings
• Enhanced Security - Zero vulnerabilities detected
• Modern Tooling - ESLint v9, Webpack 5.99, latest build tools

🗺️ Enhanced Maps Component

• 5 Interactive Examples - No external API dependencies required
• CSS-Based Terrain - Beautiful satellite-style visualizations
• Responsive Design - Works perfectly on all devices
• Animation Effects - Smooth interactions and hover states

📦 Performance Improvements

• Reduced Bundle Size - 50KB improvement (1.87 MiB → 1.82 MiB)
• Faster Builds - Optimized webpack configuration
• Clean Console - No 404 errors or warnings during development
• Better Caching - Improved asset loading and browser caching

🔧 Developer Experience

• Modern SASS - Using latest @use modules instead of deprecated @import
• ESLint v9 - Latest linting with flat configuration format
• Clean Development - Professional console output without noise
• Security First - All dependencies audited and updated

PRO Version Available here

Preview

🚀 Quick Start

Installation

Download and Uncompress the theme package archive in your desired folder location.

Download and install Node.js LTS from https://nodejs.org/en/download/

Install the app dependencies by running the following command in the command line inside the folder root where you have unzipped the theme package archive.

npm install

After npm finishes installing the modules from package.json you can go ahead and start the application. To do so, run the command below.

npm run start

After the command finished, you should see a Compiled successfully! message in your terminal window. Also, a web server service will be started so you can view your app in the browser: http://localhost:8080

Production Build

To create a production optimized build run the command below:

npm run build

This created another folder in the root of your project named build. You'll have an option to start a local web server to view your newly created production build.

🎯 Key Features

Modern Technology Stack

• Bootstrap 5.3.7 - Latest version with all features
• jQuery 3.7.1 - Reliable and performant
• Chart.js 4.5.0 - Beautiful data visualizations
• SASS 1.89.2 - Modern CSS preprocessing
• Webpack 5.99.9 - Latest build tooling

Components & Features

• ✅ Responsive Design - Mobile-first approach
• ✅ 5 Interactive Maps - No API keys required
• ✅ Chart Integration - Beautiful data visualization
• ✅ Calendar Component - Full-featured event management
• ✅ Form Elements - Complete form components library
• ✅ Navigation Systems - Multiple menu styles
• ✅ Card Components - Flexible content containers
• ✅ Button Variants - Extensive button library
• ✅ Icon Libraries - FontAwesome, PE7, Linearicons
• ✅ Animation Support - Smooth transitions and effects

Developer Benefits

• 🔒 Security Focused - Zero vulnerabilities
• 🚀 Performance Optimized - Fast loading times
• 🛠️ Easy Customization - Well-structured SASS files
• 📱 Mobile Ready - Responsive across all devices
• 🎨 Theme Flexibility - Multiple color schemes
• 🔧 Modern Tooling - Latest development tools

📁 Project Structure

architectui-html-theme-free/
├── src/
│   ├── assets/           # SASS, images, fonts
│   ├── DemoPages/        # HTML templates
│   ├── layout/           # Layout components
│   └── scripts-init/     # JavaScript modules
├── build/                # Production build output
├── package.json          # Dependencies and scripts
└── webpack.config.js     # Build configuration

🔄 Upgrade from v4.1.0

This version includes breaking improvements. For existing projects:

1. Backup your customizations
2. Update dependencies: npm install
3. Review SASS changes if you've customized themes
4. Test your maps - new implementation may require updates

📈 Version History

• v4.2.0 (2025-06-20) - Complete modernization, SASS future-proofing, enhanced maps
• v4.0.0 (2023-10-17) - React v18 migration, dependency upgrades
• v3.1.0 (2022-08-22) - Library updates
• v3.0.0 (2022-04-05) - WebPack v5 migration
• v2.0.0 (2021-09-07) - Bootstrap v5 migration

🤝 Contributing

We welcome contributions! Please feel free to submit issues and pull requests.

📄 License

Licensed under MIT. See LICENSE for details.

🔗 Links

• Website: DashboardPack.com
• Pro Version: ArchitectUI Pro
• Documentation: Available with Pro version
• Support: Contact Support