Report Components
A dependency-free HTML and CSS component library for reporting surfaces — dashboards, investor updates, operating reviews — that opens in a browser and prints correctly.
CREATED JUN 5, 2025 · UPDATED MAR 23, 2026
PROBLEM
Every recurring report was rebuilt in whichever tool was open, so the same bar chart had four visual identities and none of them survived being printed.
HYPOTHESIS
Eight components and a token file cover almost every reporting surface, and a chart drawn in CSS beats one drawn in a library you then have to ship.
ARCHITECTURE
Eight components — bar, donut, progress, stat, sparkline, bullet, timeline, leaderboard — each a standalone directory that opens directly in a browser. One theme file carries forty-odd custom properties for colour, type, spacing and motion, in full light and dark. Three example compositions assemble them into realistic pages, and sizing is print-aware throughout.
STACK
RESULT
Live as a gallery, and used as the source for real reports.
LEARNINGS
- Print-aware sizing has to be a constraint from the first component; retrofitting it is a rewrite.
- A component you can open by double-clicking gets reused; one behind a build step does not.