Maple
⌘K
DOCUMENTATIONv2.0.24

Trade-offs

Maple moves styling work from build time to runtime. That gives you zero build steps, zero configuration, no unused CSS, and dynamic styling. It also means the following.

JavaScript is Required

Maple generates styles in the browser rather than shipping a static stylesheet, so it carries the same requirement as any client-rendered application. This is the fundamental trade-off for a no-build pipeline and constant transfer size. If you need to fully support JavaScript-disabled clients, Maple may not be the right tool for you.

Runtime Work Scales with Utility Classes

Work is proportional to the number of unique utility classes that appear in the DOM, not to the number of elements; a class that repeats reuses the rule already generated. In exchange, a class that never appears is never generated, so a page pays only for what it renders.

Relative OKLCH Colors

Maple color utilities use CSS relative color syntax with OKLCH, so colors can be adjusted from their base values in the browser. As of August 2026, global support for relative color syntax is about 91%, with broader support for plain OKLab and OKLCH colors. Browsers that do not support relative color syntax ignore those generated color declarations.

ESC

Start typing to search across the documentation.