Description
User Management Dashboard — Users, Roles & Permissions Admin Template
A complete admin surface for user and access management, rebuilt from the ground up in 2026. No framework, no jQuery, no CSS preprocessor — just Tailwind CSS v4, plain ES modules, and a Vite 8 multi-page build that emits static HTML. Drop it into Laravel Blade, Django templates, Rails, .NET, WordPress, or any static host. 50 pages, light and dark, and every one of them verified against WCAG 2.1 AA in both themes before release.
Why this edition?
- A domain, not a kitchen sink — every page answers a question an admin actually has: who has access, who granted it, when does it expire, what did they do
- Zero framework lock-in — plain ES modules and
data-attribute hooks; adddata-datatableto a table and it gets search, sort, faceted filters, column visibility and CSV export - Tiny runtime — 107 KB of shared JS and 57 KB of CSS (33 KB and 11 KB gzipped); ApexCharts, Leaflet and Notyf are code-split and lazy-loaded
- Any backend — plain HTML, CSS and JS with relative asset paths, so it works from a domain root or a sub-path with no configuration
5 Dashboards + Charts
- Overview — a drag-to-reorder KPI row, user growth, signups vs. churn, role distribution, sign-ins this week
- User Analytics — active users, stickiness, retention curve, acquisition source, and a map of where people sign in from
- Security — MFA adoption, privileged accounts, failed sign-ins, recertification queue
- Onboarding — invitation funnel, time-to-first-login, stalled invites
- Dashboard Builder — a widget palette and drag-and-drop canvas so an admin can compose their own view; layout persists
- Charts — area, line, column, bar, donut, radial and heatmap, plus dependency-free inline SVG sparklines; every chart reads the theme tokens and re-tints live when you change the accent or flip to dark
Users, Roles & Access Control
- All Users — a full data table with search, role/team/status facets, column visibility, pagination and CSV export, written in-house in about 200 lines of vanilla JS
- User Detail — profile, role history, active sessions and per-user permission overrides
- Add User — a validated multi-step wizard with a review step and a success state
- Invitations — pending, expiring and expired, with resend and revoke
- Admins & Grant Admin — scoped, time-boxed admin grants with an expiry and a recertification date
- Roles, Permissions, Modules — role list with member counts and inheritance, a readable permission matrix that distinguishes inherited from overridden, and feature toggles including plan-gated and beta states
Organisation, Monitoring & Billing
- Teams, Groups, Sessions — the org shape plus what is signed in right now, with device, location and last-seen
- Audit Log — append-only, filterable and exportable, with a date-range picker
- Reports — scheduled exports
- Billing, Subscriptions, Plans, Invoice — the commercial side, including a printable invoice
App Pages, Auth & Account
- Apps — Mail, Messages, Calendar, Task Board (kanban, keyboard-operable with live-region announcements) and a Brand Asset library with a native
<dialog>lightbox - Auth — Login, Register, Forgot Password, Reset Password, Two-Factor with an auto-advancing OTP input, Lock Screen
- Errors — 403, 404, 500 and Maintenance
- Account — Profile, Settings, Notifications, API Keys, Help Centre, and a Docs page that documents every
data-hook for the end user - UI Kit — Components, Forms, Tables, Charts, Typography and Icons; the icon page is generated from the curated set so it can never drift from what is bundled
Theming
Light and dark, four accent presets (Violet, Blue, Teal, Rose) and three density settings, all switchable at runtime from the header or Settings. Choices persist and re-apply before first paint, so there is no flash of the wrong theme.
Colours are OKLCh custom properties — change the accent in one place and it flows through buttons, links, focus rings, charts and the sidebar. Every accent, chart and status colour also ships a -text twin: the same hue and chroma at a lightness solved so the colour still clears contrast as small text on a tint of itself, which is where most templates quietly fail.
Accessibility — verified, not asserted
npm run check opens all 50 pages in light and dark through a real browser and fails the build on any serious or critical axe-core violation against WCAG 2.1 A/AA, horizontal overflow at 360px, console errors, failed requests, an icon name outside the curated set, a missing title or lang, more than one visible H1, a broken internal link, or a bundle over budget. It ships with the template, so the bar holds after you swap in your own content.
Skip links, ARIA tablists with arrow-key navigation, a keyboard-operable kanban board, visible focus rings, prefers-reduced-motion support, and status that is never conveyed by colour alone.
Developer Experience
- Adding a page is copying a file — Vite discovers every
.htmlin the project root, so there is no route config npm run check— the full health sweep described abovenpm run csp— prints a strict Content-Security-Policy with the real hash of the one inline script, verified against every page- Full source, no obfuscation — pages, partials, styles, modules and build config, plus the built static site ready to upload
Tech Stack
| Styling | Tailwind CSS v4 with OKLCh colour tokens |
| JavaScript | Vanilla ES modules — no framework, no jQuery |
| Templating | Handlebars partials via vite-plugin-handlebars |
| Charts | ApexCharts (lazy-loaded, theme-reactive) |
| Tables | In-house vanilla datatable |
| Dates & masks | In-house — no dependency |
| Maps | Leaflet with OpenStreetMap tiles (lazy-loaded) |
| Toasts | Notyf (lazy-loaded) |
| Icons | Lucide — 188 curated, tree-shaken |
| Font | Inter Variable, self-hosted |
| Build | Vite 8, multi-page |
| Quality gate | axe-core + Playwright page sweep, both themes |
License: Commercial | View Live Demo
Pricing
