GC Design System
Build modern, accessible, human government services people can use.
About usBuild modern, accessible, human government services people can use.
About usVisit our Figma library to explore design assets.
Start designingInstall the component package.
Start developingTake a look around.
User interface building blocks address different user objectives.
Select reusable code for common components, paired with best practice advice, for the framework you're using.
Reusable page layouts combine components into common page types.
Start your project with basic, pre-built pages that provide a consistent, recognizable Canada.ca experience.
Coming soon
Brand and design decisions built into code.
Learn how encoded decisions shape the design of government services for a consistent visual experience.
Check out what we're working on.
Read about the latest additions.
A card is a box containing structured, actionable content on a single topic.
A date input is a space to enter a known date.
Have questions? Something you'd change or you'd like to see? Share your feedback with us to help improve GC Design System.