Skip to content

FR

Introduction Guiding principles for content

The Bank’s corporate identifier Card layout Colour Layout Margins and padding Navigation elements Tables Typography

Author Banner Button Email Form elements

Checkbox Select Text Textarea

Hero Icon Notice Phone number Share

Choosing a chart type Labelling charts Applying chart colours and textures Stacked area chart Bar and column charts Line chart Pie and donut charts Scatter chart Mixed chart

Accessibility guidelines

Applying chart colours and textures

Using colours and textures effectively is key to communicating the chart content.

Colour palette

Our charts offer 30 distinct colours, 10 of which are highly accessible.

The colour contrast allows visually-impaired users to easily differentiate between them.
Greys are reserved for:

neutral values
identifying the target range in line charts

Credits: Name that Color JavaScript library by Chirag Mehta.

Projections

Dotted lines are reserved for projections in line charts.
Diagonal lines in bar and column charts are reserved for projections.