# Comparison (https://www.tailwind-variants.org/docs/comparison)

Compare Tailwind Variants with Class Variance Authority (CVA), Windstitch, and hand-written class strings for component libraries.

## Feature matrix
| Feature                  | Tailwind Variants | CVA                  | Windstitch | Classnames |
| ------------------------ | ----------------- | -------------------- | ---------- | ---------- |
| Variants & defaults      | Yes               | Yes                  | Yes        | —          |
| Compound variants        | Yes               | Yes                  | Yes        | —          |
| Framework agnostic       | Yes               | Yes                  | —          | Yes        |
| Slots (split components) | Yes               | —                    | —          | —          |
| Compound slots           | Yes               | —                    | —          | —          |
| Overrides                | Yes               | Yes                  | Yes        | —          |
| `extend` composition     | Yes               | —                    | Yes        | —          |
| TypeScript autocomplete  | Yes               | Yes                  | Yes        | —          |
| Requires Tailwind CSS    | Yes               | —                    | Yes        | —          |
| Conflict resolution      | Built-in          | Via `tailwind-merge` | —          | —          |

## vs manual class strings
|               | Manual strings               | Tailwind Variants              |
| ------------- | ---------------------------- | ------------------------------ |
| Consistency   | Easy to drift across files   | Single recipe, many call sites |
| Overrides     | String concat, merge bugs    | Built-in conflict resolution   |
| Multi-part UI | Separate strings per element | Slots with per-slot variants   |
| Types         | None                         | `VariantProps` inference       |

## vs CVA (Class Variance Authority)
[CVA](https://cva.style) is an excellent, lightweight variant generator. Tailwind Variants started as an extension of that idea.

**Choose CVA** when you want the smallest possible variant helper and are fine wiring `tailwind-merge` yourself.

**Choose Tailwind Variants** when you want slots, built-in merge, compound slots, and a design-system-oriented API — especially for component libraries like [HeroUI](https://heroui.com).