Class Variance Authority
cva builds type-safe, variant-driven class names for any styling approach, with first-class Tailwind CSS support.
CSS-in-TS libraries such as Stitches and Vanilla Extract handle type-safe UI variants without you managing class names or stylesheet composition by hand.
CSS-in-TS isn’t for everyone, though. You may need full control over your stylesheet output, use a framework such as Tailwind CSS, or prefer writing your own CSS.
Creating variants with the “traditional” CSS approach can become an arduous task: manually matching classes to props, and manually adding types.
cva takes away those pain points, so you can focus on building your UI.
Sponsors
Section titled “Sponsors”Acknowledgments
Section titled “Acknowledgments”- Stitches (WorkOS)
Huge thanks to the WorkOS team for pioneering thevariantsAPI movement: your open-source contributions are immensely appreciated - clb (Bill Criswell)
This project originally started out with the intention of merging into the wonderfulclblibrary, but after some discussion with Bill, we felt it was best to go down the route of a separate project.
I’m so grateful to Bill for sharing his work publicly and for getting me excited about building a type-safe variants API for classes. If you have a moment, please go and star the project on GitHub. Thank you Bill! - clsx (Luke Edwards)
Previously, this project surfaced a customcxutility for flattening classes, but it lacked the ability to handle variadic arguments or objects. clsx provided those extra features with quite literally zero increase to the bundle size: a no-brainer to switch! - Vanilla Extract (Seek)