Linear’s team shifted its React apps from styled-components to StyleX to cut down on runtime style generation and speed up page renders. Styled-components worked well for keeping CSS close to components and letting developers move fast, but its flexibility encouraged styling at a distance and blew up render‐time costs. With React 18’s useInsertionEffect available, styled-components never adopted it, and the library slid into maintenance mode. That nudged Linear to look for a system with build‐time style extraction, clear styling contracts, and predictable style merging. They evaluated several options—vanilla-extract offered static extraction and type safety but forced separate style files. StyleX landed squarely on their wish list: a small API, atomic class names, type-safe contracts, and strict rules against external overrides. It’s backed by Meta and already powers web UIs at Figma and Cursor. The trade-off is losing some CSS freedoms—no parent-dependent selectors or global wrappers—but those patterns were the same ones causing maintenance headaches at scale. To handle the massive code churn, they built a codemod framework named styled-components-to-stylex with over 500 pull requests and 100,000 lines of migration logic. They complemented it with a custom ThemeProvider for Linear’s nested theming, clear agent scopes, and validation scripts. Agents run the codemod and compare rendered UIs, but teams still hand-check hover states, theming branches, and layout quirks. Custom lint rules catch old patterns early, and CSS Modules serve as an escape hatch for truly global styles. By mid-migration they’ve converted 58% of files and measured about 30% faster page‐to‐page renders. Progress comes in stages: define StyleX primitives, migrate leaf components first, then tackle shared wrappers. It’s been fiddly, but so far the approach cuts runtime CSS costs and tightens up component APIs for safer future growth.