Vanilla Extract Has a Free API You Should Know About

Vanilla Extract is a zero-runtime CSS-in-TypeScript library. Write styles as TypeScript expressions, get type-safe, locally scoped CSS at build time. Why Vanilla Extract for Type-Safe CSS A design system team had CSS conflicts from global class names. CSS Modules helped but lacked type safety. Vanilla Extract gives them TypeScript imports for every style — typos are caught at compile time. Key Features: Zero Runtime — All CSS generated at build time TypeScript — Full type safety and autocomplete Locally Scoped — No class name conflicts Theme Support — Type-safe theme contracts Framework Agnostic — Works with any framework Quick Start npm install @vanilla-extract/css // button.css.ts import { style } from " @vanilla-extract/css " export const button = style ({ padding : " 12px 24px " , borderRadius : 8 , backgroundColor : " #3b82f6 " , color : " white " , " :hover " : { backgroundColor : " #2563eb " } }) import { button } from " ./button.css " function Button () { return < button classN