---
title: "Class Variance Authority"
description: "Build type-safe, variant-driven class names for any styling approach, with first-class Tailwind CSS support."
url: "https://cva.style/"
---

![cva logo](https://cva.style/assets/img/wallpaper-4k.png)



`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](https://stitches.dev/docs/variants) and [Vanilla Extract](https://vanilla-extract.style/documentation/api/style-variants/) 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

Want to support this project?

`cva` is a privately-maintained **free** open-source project.\
Please consider [**sponsoring**](https://cva.style/sponsors) my work to contribute towards development efforts financially.

## Acknowledgments

* [**Stitches**](https://stitches.dev/) ([WorkOS](https://workos.com/))\
  Huge thanks to the WorkOS team for pioneering the `variants` API movement: your open-source contributions are immensely appreciated
* [**clb**](https://github.com/crswll/clb) ([Bill Criswell](https://github.com/crswll))\
  This project originally started out with the intention of merging into the wonderful [`clb`](https://github.com/crswll/clb) library, 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](https://github.com/crswll/clb). Thank you Bill!
* [**clsx**](https://github.com/lukeed/clsx) ([Luke Edwards](https://github.com/lukeed))\
  Previously, this project surfaced a custom `cx` utility for flattening classes, but it lacked the ability to handle variadic arguments or objects. [clsx](https://github.com/lukeed/clsx) provided those extra features with quite literally zero increase to the bundle size: a no-brainer to switch!
* [**Vanilla Extract**](http://vanilla-extract.style/) ([Seek](https://github.com/seek-oss))

## Downloads

* [Wallpaper](https://cva.style/assets/img/wallpaper-4k.png)

## License

[Apache-2.0 License](https://github.com/joe-bell/cva/blob/main/LICENSE) © [Joe Bell](https://joebell.studio/)