Primer Design System

Health v2 · maintenance only

Adoption not part of the score

3892 stars · 673 forks observed · 2026-08-28

What it is AI-extracted, prompt v1, taxonomy v1, 2026-08-29, confidence not recorded

Primer is GitHub's design system, and this repository is its CSS implementation written in SCSS and distributed via npm as @primer/css. It provides utility classes, theming, and design tokens matching GitHub's UI, though the project is now in KTLO (keep-the-lights-on) mode with Primer React recommended for complete styled patterns.

Use cases

• style a web app to look like GitHub's UI
• use GitHub's design tokens and color themes in CSS
• apply GitHub-style markdown formatting with markdown-body
• import Sass modules for core, product, or marketing styles
• build accessible, responsive interfaces with GitHub's design language
• find GitHub's Octicons icon library

When to choose

• you want GitHub's exact look and feel in a web project
• you need a mature, accessible CSS framework with light/dark theming
• you're already using Primer React and need base styles or markdown styling
• you want design tokens as CSS variables across nine color themes

When to avoid

• you need actively developed new components - the CSS package is in KTLO mode
• you want a fully componentized workflow - prefer @primer/react or primer/view_components
• you need a design system unrelated to GitHub's visual language
• you don't use Sass or a bundler that can handle SCSS imports

Facets

framework · maturity maintenance

ui-components css-framework theme accessibility web-development frontend web-design developer-tools browser cross-platform design-system sass scss github octicons design-tokens figma react-components ktlo web-server nodejs

Member repositories

For agents

markdown · JSON · MCP: product_card(name="primer/react")