Dashboard UI Kit is a living style guide and a drop-in stylesheet + script for building admin panels and analytics apps. Every component is shown in all its states with copy-paste snippets generated from the live markup, plus a token reference for colors, type, spacing, radius and elevation.
It includes stat cards with sparklines, hand-written SVG charts (line, bar, stacked bar, donut, heatmap), semantic sortable tables, a full filter-and-paginate data table, empty states with recolourable illustrations, tabs, dialogs, menus, toasts and forms. Three navigation shells are included: expanded sidebar, collapsed icon rail and top navigation, all collapsing to a mobile drawer.
Three complete example pages (analytics, orders table, settings) show how the pieces compose. Everything is plain HTML, CSS and vanilla JavaScript with no dependencies, works from file://, and ships with light and dark themes. Data is mocked; the single js/api.js file is where you plug in your backend.
Highlights
- Living style guide with copy-paste snippets for every component
- Handwritten SVG charts with tooltips, legend toggles and keyboard inspection
- Data table: search, filters, sort, pagination, selection, CSV export, empty state
- 3 navigation shells: expanded sidebar, icon rail, top nav (mobile drawer included)
- 3 full example pages: analytics, orders, settings
- Light and dark themes via CSS tokens, OS preference and toggle
- Accessible: semantic HTML, visible focus, ARIA tabs/menus, reduced-motion
- Zero dependencies, no build step, CC0 license
mammoth templates


