Back
GitHub moved fully to CSS Modules and retired styled-components
SiTech AI Team2 წთ. საკითხავი

GitHub moved fully to CSS Modules and retired styled-components

Engineers at GitHub have described how the company replaced CSS-in-JS with CSS Modules across its interface, reporting 55% less time to server-side render a page and 25% less time for components to initialize.

Engineers at GitHub have described how the company replaced CSS-in-JS with CSS Modules across its interface. Published on the GitHub Blog on September 25, 2026, the account was written by Primer design system engineers Josh Black and Marie Lucca.

Why the styling stack became a bottleneck

Trouble started in 2023, when the number of components on some pages exploded: initial page loads grew slower because styles were initialized on the client, server-side rendering performance declined, and style updates became harder to control. The Primer team wanted an approach that avoided both client and server costs without breaking GitHub.

CSS Modules and a gradual migration

The team settled on CSS Modules. In that format, styles are authored in a CSS file next to the component's JavaScript source, class names are local by default, and no runtime is required: styles roll up into stylesheets shipped as part of the page's HTML. Each component moved over behind a feature flag toggling between old and new styles, with visual regression tests confirming identical snapshots and a gradual rollout from the team to GitHub staff and finally to all users. The migration was complete by December 2024, bringing 55% less time to server-side render a page and 25% less time for components on a page to initialize.

GitHub table: server-side rendering improvement by service

Retiring the sx prop

The harder problem was the sx prop, the long-standing way to customize Primer components. It offered strong TypeScript support and co-location, but carried a high runtime cost and scaled poorly. GitHub built a compatibility package, @primer/styled-react, so existing code kept importing components while implementations moved to @primer/react. Work began in April 2025 with roughly 7,760 sx props to migrate. A rotation of eight engineers moved 6,419 props over six months, with server-side rendering gains from 1% to 22% on some pages. When it resumed in April 2026, two engineers with Copilot coding agents took the remaining 895 props to zero in three weeks.

GitHub chart: decline in total sx props over time

Seven themes and the final cleanup

GitHub supports seven themes, each with a high contrast variation, all driven through styled-components. Theming variables already lived in CSS, so the remaining work was removing JavaScript utilities; two months later the dependencies were gone. GitHub has run on 100% CSS Modules since June 2026, with sx, styled-components and styled-system removed from its main application.

SSiTech

SiTech — AI-powered web development

We build fast, modern websites and bring AI into real business workflows. Have a project or a question? We'd love to help.