A class-light CSS framework for semantic HTML. Bare tags look great with no classes; a small data-* vocabulary adds variants; adata-theme container re-lights the whole page — shadows and all — from ~20 tokens.
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/hikariui/dist/hikari.min.css">
<script src="https://cdn.jsdelivr.net/npm/hikariui/dist/hikari.js" defer></script>Every element below is bare semantic HTML — the only attributes are Hikari's data-* hooks. Switch the theme above; it all re-lights.
Type an invalid address and blur — native :user-invalid.
No utility classes, no JS framework, no build step for you. It styles pages you own; it yields to any pre-existing site CSS by design.
It's all ~20 variables. Drag these three Tier-1 tokens and watch the whole page recompute — spacing scale, radius scale, and the accent-tinted shadows all derive from them.
This card, its radius, its accent-tinted shadow, and the button below all read from the three tokens on the left.