Colors
$ons-blue
$ons-green
$ons-black
Usage notes
The primary colour palette has been specifically developed to support flexible, straightforward and clear communication.
This colour scheme has been refined for web usage and is in keeping with ONS's brand guidelines.
Please do not introduce any new colours to the exiting palette. It is ok to use lighter or darker tints of each colour for shading, active states etc., but avoid additional colours that are not tints.
If you wish to emphasise a section of a page, try using weight, scale and proximity, or de-emphasise other areas instead.
Additional colours, even colours in the palette, can add clutter to a page.
$black
$white
$off-white
$grey-light
$grey
$grey-cold
$grey-warm
Usage notes
This colour scheme has been refined for web usage and have been chosen to complement the primary colours
$blue-alt
$ons-green--light
$blue-light
$azure
$green-dark
$box--orange
$red
$red-dark
$pink
Usage notes
Accent colours should used in small quantities to add visual depth to a page.
This colour scheme has been refined for web usage and is in keeping with ONS's brand guidelines. They have been chosen to complement the primary colours
Please do not introduce any new colours to the exiting palette. It is ok to use lighter or darker tints of each colour for shading, active states etc., but avoid additional colours that are not tints.
If you wish to emphasise a section of a page, try using weight, scale and proximity, or de-emphasise other areas instead.
Additional colours, even colours in the palette, can add clutter to a page.