45+ Lit 3 web components with zero visual CSS.
Theming flows through tokens. You own the style.
Use a modern theme with clean defaults or roll your own.
Shadow DOM solves encapsulation. Voidable solves the opposite problem: components that are deliberately transparent to their environment.
No Shadow DOM barrier. Your CSS reaches into every component without ::part() incantations.
Three-layer token system. Override CSS custom properties; the entire library remaps.
Singleton-safe customElements.define(). Same library loads once across federated modules.
Pairs with Solid + UnoCSS for bundle sizes that are IoT friendly. Tree-shakes to component-level granularity.
Semantic void-* custom elements with reflected attributes. Stable selectors for Playwright, AI agents, screen readers.
data-shape="sharp" zeros every radius globally or locally. Brand toggle without CSS rewrites.
Three layers. Primitives are raw: color scales, spacing, type, radii. Semantic tokens map to roles: --void-color-bg, --void-color-text-secondary, --void-color-border-strong. Component CSS references only tokens. Override any layer; the whole library follows.
/* Override one variable.
Watch the entire library remap. */
:root {
--void-color-accent: #3b82f6;
--void-color-accent-hover: #2563eb;
--void-radius-md: 8px;
--void-color-bg: #0a0e1a;
--void-color-text: #e5e7eb;
}
[data-shape="sharp"] {
--void-radius-md: 0;
--void-radius-lg: 0;
}Read the docs, copy the install line, render a button. Ten minutes.