Espalier
Enterprise-grade web components.
Built on browser standards, not around them.
Espalier is a web component library built on
Lit that takes the modern browser platform
seriously. Instead of shimming around limitations, it builds directly on
standards that have already shipped: OKLCH color, Container Queries, CSS
nesting, and ElementInternals for native form participation.
The result is a design system with zero runtime dependencies beyond Lit, perceptually accurate color, mathematically fluid typography, and components that work in any framework—or no framework at all.
Perceptual Color
Every color computed in OKLCH. Every contrast ratio verified by APCA. Themes derived mathematically, not eyeballed.
Fluid Typography
Mathematical type scales using clamp(). Text that reads
beautifully from phone to ultrawide without a single breakpoint.
Accessible by Default
APCA contrast, semantic HTML, full keyboard navigation, and ARIA built into every component from day one.
Native Form Participation
ElementInternals for real form submission, validation,
and reset. Custom controls that work exactly like native ones.
Intrinsic Layout
Container Queries, not viewport breakpoints. Components respond to the space they have, not the size of the screen.
Framework Agnostic
Standard custom elements that work everywhere: React, Vue, Angular, Svelte, or plain HTML. No framework lock-in, ever.
Get Started in 60 Seconds
npm install @taprootio/taproot-controls<script type="module">
import "@taprootio/taproot-controls";
</script>
<esp-root>
<esp-form>
<esp-form-item label="Name">
<esp-input name="name" required></esp-input>
</esp-form-item>
<esp-button label="Submit" variant="primary" button-type="submit"></esp-button>
</esp-form>
</esp-root>
Every <esp-*> element registers itself, inherits its
theme from <esp-root>, and participates in the native
form lifecycle automatically.
Explore
Getting Started
Installation, root setup, your first component, and a simple form.
Components
Browse the full catalog of form controls, pickers, layout, and navigation.
Architecture
Color engine, fluid typography, layout governance, and design philosophy.
Browser Support
Minimum versions, required polyfills, and enterprise support policy.