Stitches CSS-in-JS

Stitches is a CSS-in-JS styling library for React applications that focuses on performance and developer experience. Created by Pedro Duarte and the Stitches team, the library achieves near-zero runtime overhead by avoiding unnecessary prop interpolations during rendering, making it faster than many alternative CSS-in-JS solutions. Stitches introduces variants as a first-class API concept, allowing developers to define multiple visual styles, compound variants that combine multiple conditions, and default variant values, all with automatic TypeScript inference for type-safe usage. The library supports server-side rendering out of the box, theming through tokens, the css prop for inline styling, the as prop for element swapping, and utility functions for custom styling logic. The core package weighs approximately 5.9 kilobytes and the React-specific package 6.1 kilobytes, both tree-shakeable. While the library is no longer actively maintained as of 2023, it remains in production use at companies like Vercel, Radix UI, and Linear. The framework-agnostic core package can be used with Vue, Svelte, and vanilla HTML, though the React package is the primary distribution.