Console — Free Admin Dashboard Website Template
Console is a genuinely modern admin dashboard template — the kind of ops panel a 2026 SaaS ships, not a recycled 2015 theme. It pairs a fixed collapsible sidebar and a command-bar topbar with real data widgets: KPI stat cards with sparklines, two live Chart.js charts, a sortable orders table, an activity feed and a task tracker — all with a vanilla-JS light/dark theme that remembers your choice.
Features
- Fixed, collapsible sidebar with inline-SVG icons, grouped sections and an off-canvas drawer on mobile
- Command-style topbar: search with ⌘K hint, notifications dropdown and a user menu with avatar
- Four KPI stat cards, each with a tiny SVG sparkline and a signed delta
- Two Chart.js visualizations — a gradient revenue line (this period vs previous) and a sales-by-channel donut
- Sortable recent-orders data table with customer avatars and semantic status pills
- Recent-activity timeline plus an interactive task list wired to a live progress bar
- Light/dark theme toggle in vanilla JS, persisted to localStorage via a
data-themeattribute and CSS variables - Polished split-screen login page (brand panel + form) with password reveal and SSO buttons
At a glance
- Framework: Bootstrap 5
- License: Free for personal and commercial use
- Pages: 2
- Responsive: Yes
- Style: Modern SaaS admin — deep navy-indigo shell, iris accent, semantic status colors
How to use it
Download the ZIP, unzip it, and open index.html — there is no build step and no dependencies to install. Replace the demo text and images with your own, point any forms at your backend or a form service, and deploy the folder to any static host. Colours, fonts, and spacing live in css/style.css; the interactions are in js/main.js. Bootstrap 5 is bundled locally, so it works offline and on strict-CSP hosts.
FAQ
Is Console really free for commercial projects?
Yes. Console is free for personal and commercial use — build client dashboards, internal tools or SaaS admin panels with no license fee.
Does it need a build step or npm?
No. Bootstrap 5 and the CSS/JS are self-hosted with relative paths, so you can open `index.html` directly or drop the folder onto any static host. Chart.js loads from a CDN and degrades gracefully if blocked.
How does the dark mode work?
A vanilla-JS toggle flips a `data-theme` attribute on the root element and every color is a CSS variable, so light and dark are two curated palettes rather than an automatic inversion. Your choice is saved to localStorage and applied before first paint.
Are the icons an icon font?
No. Every icon is inline SVG, so there are no font files to load, nothing breaks under strict content-security policies, and each glyph inherits color and stroke from CSS.
