GC Design System Components Installation Page templates Contact us Get involved Find a demo GC Design System Components

Header
<gcds-header>

Also called: global header, brand header.

The header is the responsive Government of Canada branded header landmark.

Header component preview

Header is a required component for Canada.ca pages.

Take a look at what problems the header solves to see if they fit the problem you're solving for.

Problems headers solve

Use this header landmark – as part of a trusted brand – for apps, forms, or other transactional digital services to consistently communicate:

Related components

Footer for placing the Government of Canada branded footer landmark.

Top navigation for guiding navigation through a website using a landmark.

Help us improve

Have questions or a request? Give feedback on our contact form.

Something's wrong? Raise it through GitHub with an account. You'll have access to the team's direct responses, progress made on your issue, and issues raised by others.

Give feedback Report an issue on GitHub
2025-03-10