Signature
<gcds-signature>

Also called: wordmark.

The signature is the Government of Canada landmark identifier found in the header or footer.

• GitHub
• Figma

Signature anatomy

1. The Government of Canada Signature is a brand identifier found in the site's header. The signature is used as a global link to the site's homepage.
2. The Canada Wordmark is a brand identifier found in the site's footer. It reinforces the brand by communicating to a site visitor that they're reading content from the Government of Canada.

Design and accessibility for the signature

Set the language order in the signature

Display the French-first signature on French pages and the English-first on English pages.

Note: The image is hyperlinked to the Canada.ca homepage in the same Official Language as the current page.

Apply non-standard colours accessibly

• Opt to apply non-standard colours when a higher level of contrast with the background is needed, like for dark mode.

• Opt to apply non-standard colours when a single colour is used in a product, like in black and white.

• When making changes to the flag colour, always match the colour of the flag symbol in the signature and in the wordmark.

• Always apply the same colour combination in the signature and wordmark. For example, if one is black and white, the other needs to be as well.

• For single colour, check the contrast ratio between the signature elements for, at minimum, WCAG AA compliance.

The standard colour style uses black text and a red flag applied to a white backdrop.

The reversed colour style uses white text and a red flag applied to a black backdrop.

The black and white style uses all black or all white. All black is the more common use.

Single colour style uses another colour if that colour is the only colour used in the product.