Tailwind components with multiple looks (variant, size, state) devolve into unreadable ternary soup inside className. Keeping the combinations consistent and typed — so a size="lg" actually maps to the right classes — is hard to do by hand.

CVA (class-variance-authority) is exactly what shadcn/ui uses under the hood to define component variants. You declare base classes, named variants, and default variants once; calling the resulting function with props returns the correct class string. It's fully typed, so invalid variant values are caught at compile time, and it pairs naturally with tailwind-merge.