Reusable components make it easy to build consistent, accessible interfaces in Figma and React. Start using components
The B.C. Design System gives design and software development teams the building blocks to deliver intuitive, accessible digital services.
Reusable components make it easy to build consistent, accessible interfaces in Figma and React. Start using components
Explore technical docs, interactive previews and code for design system components. Go to the design system workshop
Design tokens are a source of truth for basic design decisions like colour and typography. Learn about design tokens
Guidance on layout, typography, colour and iconography.
Find design assets, code and technical docs for user interface components.
Learn what we're working on now, and what's planned for the future.
The B.C. Design System is open-source. There are several ways you can contribute.
Digital services must meet the Web Content Accessibility Guidelines (WCAG) Level AA standard.
Access common technical documentation, community knowledge bases, code samples and APIs.
The design system is an open source project, to help software developers and designers in the B.C. government deliver a consistent digital user experience for the public. It is maintained by Service BC and Government Digital Experience, part of the Ministry of Citizens' Services.
If you have questions or feedback, get in touch: