Colours
Introduction
The new colour palette has been designed for distinctiveness and to project the Civica Brand Personality.
Guidelines
- To avoid any screen or web issues, use only the values shown here.
- Note that the use of the colour Orange / Neon Carrot is limited to graphic treatments and graphic symbols.
- Orange should not be used for any text or user interface elements in online applications.
- For body background color use White(#FFFFFF) or Guyabano (#F8F8F8).
Main Colours
Blue Lagoon
#00818A
Cerise
#D62598
Amethyst
#7B57CB
Neon Carrot
#FF8A3D
Link Colour
#20399D
Charcoal
#262626
Silver
#DDDDDD
Concrete
#F3F3F3
Guyabano
#F8F8F8
White
#FFFFFF
RAG Colours
Guardsman Red
#C00000
Tenne (Tawny)
#CC4E00
Japanese Laurel
#008A00
Accessibility Grid
Use the accessibility grid to determine which colours can be used together to meet WCAG 2.2 AA compliance
- Colour combinations marked with AA will pass for all text sizes for compliance level AA
- Colour combinations marked with AAA will pass for all text sizes for all compliance levels
- Colour combinations marked with AA18 will pass for text when >18.5px and bold, or above 24px and not bold for compliance level AA. Additionally, it is also sufficient for graphical elements and non-text features, such as form field outlines or focus states indicators
- Colour combinations not displayed do not pass AA or AAA compliance
|
Background
Text
|
Cerise
#D62598
|
Amethyst
#7B57CB
|
Neon carrot
#FF8A3D
|
Charcoal
#262626
|
Silver
#DDDDDD
|
Concrete
#F3F3F3
|
Guyabano
#F8f8f8
|
White
#FFFFFF
|
Blue lagoon
#00818A
|
|---|---|---|---|---|---|---|---|---|---|
|
Cerise
#D62598
|
Text
AA18
3.3
|
Text
AA18
3.3
|
Text
AA18
4.1
|
Text
AA
4.5
|
|||||
|
Amethyst
#7B57CB
|
Text
AA18
3.8
|
Text
AA
4.6
|
Text
AA
5.1
|
||||||
|
Neon carrot
#FF8A3D
|
Text
AA
6.4
|
||||||||
|
Charcoal
#262626
|
Text
AA
4.5
|
Text
AA18
3.3
|
Text
AA
6.4
|
Text
AAA
11.1
|
Text
AAA
13.6
|
Text
AAA
15.1
|
Text
AA18
3.2
|
||
|
Silver
#DDDDDD
|
Text
AA18
3.3
|
Text
AA18
3.8
|
Text
AAA
11.1
|
Text
AA18
3.4
|
|||||
|
Concrete
#F3F3F3
|
Text
AA18
3
|
Text
AA18
4.1
|
Text
AA
4.6
|
Text
AAA
13.6
|
Text
AA18
4.2
|
||||
|
Guyabano
#F8f8f8
|
Text
AA18
3
|
Text
AA18
4.5
|
Text
AA
4.8
|
Text
AAA
14.24
|
Text
AA18
4.3
|
||||
|
White
#FFFFFF
|
Text
AA18
3.3
|
Text
AA
4.5
|
Text
AA
5.1
|
Text
AAA
15.1
|
Text
AA
4.6
|
||||
|
Blue lagoon
#00818A
|
Text
AA18
3.2
|
Text
AA18
3.4
|
Text
AA18
4.2
|
Text
AA
4.6
|
|||||
|
AAA Pass, AAA (7+)
AA Pass, AA (4.5+)
AA18 Pass, Large Text Only (3+)
|
|||||||||