The B.C. Design System gives design and software development teams the building blocks to deliver intuitive, accessible digital services.
The B.C. Design System comprises 4 core elements:
The new design system replaces the legacy design system, which has now been archived.
The @bcgov/design-tokens package provides a method to quickly and consistently implement the province's look and feel for digital services. They offer a set of standardized options to help developers style user interfaces in a coherent and future-proof way.
You can install the design tokens library via:
To learn more about the design tokens:
The @bcgov/design-system-react-components package provides a library of reusable UI components, implemented in Figma and React. Support for other languages and frameworks is currently out-of-scope.
The component library is currently in active development. New components are added when both Figma and React implementations are complete and fully documented.
You can install the component library via:
Additional information and documentation:
The B.C. Design System is maintained by the Everyday Life Events Common Capabilities & AI Platforms branch at Connected Services BC, part of the Ministry of Citizens' Services. To get in touch: