Variant Styles

A first-class typed styling variant API.

Variant Styles is inspired by Stitches.js (opens in a new tab) which has a rich styled API where you can create type-safe UI components with variants, while they do all the under-the-hood work to manage the composition and mapping of styles to the different variants of the component.

...but...

All that is opinionated with CSS-in-TS(/JS) syntax 🤔, but with variant-styles(vs), you can use literally any styling framework 😇 and still get the benefits of variants in your component.

Creating component variants with the "traditional" approach can become a mammoth task; matching styles to props and manually adding types above it can be draining.

Variant styles (vs) comes to your rescue by providing all that hard labour of "mapping props to styles and adding types" wrapped into a nice little API.

• 🫶 Framework agnostic
• 🔥 Type safe
• 🤏 Super tiny bundle size