Caption

Captions are used for very short explanations in images/illustrations, forms, or as secondary text, such as in the cards component.

Details

There are 3 caption styles available

1. Large - 18px

2. Regular - 16px

3. Small - 14px

Usage

When to use

• To provide further context or attribution to an image/illustration, video, table, or chart
• As secondary text, as seen in the cards component

When NOT to use

• As a subtitle to a heading
• For important text that should be easily visible
• For long text blocks (i.e., more than 2-3 sentences)

How to use

• Use whichever of the 3 caption styles makes sense for your designs
• The colour 'Multi-use/Neutrals/grey85a' is recommended for captions
• Keep caption text to a few sentences maximum

Customizing captions

• Colour for captions can be changed if required; however, ensure that you are meeting WCAG AA requirements (text and background need a colour contrast ratio of 4.5:1)

How we created this component - 4A Assessment

Captions did not exist in the Canada.ca design system, so we added them to our Extended GC Design Library - DECD using best practices from other design systems.