- Home
- UI Kit Libraries
- GitHub Primer
GitHub Primer
What it is
GitHub Primer is GitHub’s free, open-source design system for creating user interfaces. Its guidance covers product UI components, patterns, and design tokens for color, spacing, and typography. Primer Brand addresses marketing websites and digital experiences, while React documentation explains theming, recommended practices, and component extension. Accessibility resources, guidelines, and tools help teams build accessible experiences with GitHub and Primer. Octicons provides a scalable icon set handcrafted by GitHub, and Product UI documentation includes an MCP server page. Components are labeled experimental, ready, or deprecated; GitHub describes ready components as mature with long-term support expected. Primer Web and Primer Primitives are available through the Primer Figma Community page. Access to GitHub’s Figma organization is limited to GitHub team members, and the Primer Mobile Figma library is internal only. Only GitHub employees can contribute to Primer Web because of Figma’s open-source file handling. GitHub’s Design Infrastructure and Design Engineering teams maintain the system, including its CSS framework, documentation, tools, libraries, and component libraries.
For and against
For
- Free, open-source GitHub design system
- Includes product and marketing UI guidance
- Provides React theming and extension documentation
- Offers accessibility resources and tools
- Includes Octicons icon set
Against
- Primer Mobile Figma library is internal only
- GitHub Figma organization access is restricted
- Only GitHub employees can contribute to Primer Web
- Components may be experimental or deprecated
The verdict
Primer provides a broad set of UI guidance, components, tokens, React documentation, accessibility resources, and icons for GitHub-oriented design work. Its Figma access rules and component lifecycle labels are important considerations for contributors and adopters.
Who it suits
It suits designers and developers building GitHub-related product interfaces, marketing experiences, or React components. Teams needing accessibility guidance, design tokens, Figma resources, or scalable icons can use its documented system.
Plans and prices
Primer
Design system for GitHub; no paid plans listed
Read 9 Oct 2026 · primer.style
On the record
- Accessibility
- Primer includes accessibility foundations, policies, principles and frameworks for accessible experiences.primer.style · read 14 Oct 2026
- Brand release
- The Primer Brand site lists version 0.79.0 as its latest release.primer.style · read 14 Oct 2026
- Brand UI
- Primer Brand UI is GitHub’s system for marketing websites and digital experiences.primer.style · read 14 Oct 2026
- Component lifecycle
- Primer marks components as experimental, ready, or deprecated, and says ready components are mature with long-term support expected.primer.style · read 9 Oct 2026
- Components
- The Product UI documentation catalogs dozens of components including buttons, dialogs, forms, navigation, tables and overlays.primer.style · read 14 Oct 2026
- Contribution limits
- Only GitHub employees can contribute to Primer Web because of how Figma handles open source files.primer.style · read 9 Oct 2026
- Contributions
- Primer publishes contribution guidance for adding components, documentation, Figma work and other changes.primer.style · read 14 Oct 2026
- CSS changelog
- The Primer CSS repository lists v22.3.0 as its latest release and describes a class-name export and pagination selector changes.github.com · read 14 Oct 2026
- CSS utilities
- Primer documents CSS utilities for animation, borders, box shadows, flexbox, grid, layout, spacing and typography.primer.style · read 14 Oct 2026
- Design tokens
- Primer Primitives provide design tokens for color, spacing and typography.primer.style · read 14 Oct 2026
- Figma
- Primer Web and Primer Primitives are available through the Primer Figma Community page, while access to GitHub’s Figma organization is limited to GitHub team members.primer.style · read 9 Oct 2026
- Icons
- Octicons is a scalable set of icons handcrafted by GitHub.primer.style · read 9 Oct 2026
- Independent adoption
- OpenProject says it began adopting Primer in 2023 and planned to use it for new features while gradually revising existing ones.openproject.org · read 14 Oct 2026
- Independent feature use
- OpenProject 17.2 updated its Backlogs module and several administration interfaces with Primer components.openproject.org · read 14 Oct 2026
- Independent limit: gradual migration
- OpenProject reports that its existing interface is being migrated to Primer gradually rather than all at once.openproject.org · read 14 Oct 2026
- Independent limit: unresolved accessibility issues
- The 2026 Primer Docs conformance report records several WCAG 2.2 AA criteria as only partially supported, with low-priority exceptions.accessibility.github.com · read 14 Oct 2026
- Independent roadmap
- OpenProject’s design-system roadmap includes Primer work for page headers, popovers, tables, color-blind mode, account screens and accessibility improvements.community.openproject.org · read 14 Oct 2026
- Licence
- The Primer design repository is released under the MIT license.github.com · read 14 Oct 2026