erikt/ui
CSS cascade layers, custom properties, color-mix(), light-dark(), anchor positioning, and the Popover API have collectively closed most of the gap that large UI libraries were built to fill. @erikt/ui takes that foundation and adds a focused component layer on top. A single stylesheet that styles native HTML elements without requiring a component model, a compiler, or a runtime.
<link rel="stylesheet" href="https://esm.sh/@erikt/ui" />
- 🗂️ One file
- 🏷️ No class names required
- ⚔️ Your styles always win
- 🌗 Dark mode built in
- 🎨 Themeable
- 📐 Zero layout opinions
- 🤖 AI-ready
Web components
A couple of optional, dependency-free custom elements ship alongside the stylesheet: <relative-time> and <copy-to-clipboard>. They're opt-in, no other part of @erikt/ui depends on them.
<script type="module" src="https://esm.sh/@erikt/ui/elements"></script>
See the docs for usage.
Local docs
The docs ship with the npm package. After installing, serve them on http://localhost:3456:
npx @erikt/ui docs
License
MIT