Offcanvas
overlay thumb
The Guardian Design System

The Guardian Design System

A design system ensuring consistency and accessibility across The Guardian's digital platforms.

Accessible Components: Designed following WAI-ARIA best practices for an inclusive user experience.
Customizable Design: Adaptable to The Guardian’s unique branding and editorial needs.
Open Source: Free to use and actively maintained by The Guardian’s development team.
Comprehensive Documentation: Detailed guidelines, best practices, and usage examples for designers and developers.
Regular Updates: Continuously improved with new features, refinements, and fixes.
Reusable Components: Prebuilt UI elements such as buttons, typography, cards, and navigation.
Design Tokens: Standardized values for colors, typography, spacing, and UI consistency.
Performance Optimized: Lightweight and efficient for fast-loading digital experiences.