Extending the Devon County Council colour palette

The Devon County Council (DCC) colour palette was first introduced in 2007 as part of the Ourbrand corporate identity rules. These colours have helped us establish a strong and consistent identity across all areas of our work. A palette of eight core house colours and five high-contrast colours for monochrome designs were developed to make printed documents more attractive and easily navigable.

In recent years Council finances have been squeezed; there has been an emphasis on money saving and fewer printed materials have been created – and many people now look for information online.

The development and adoption of Local Government Digital Service Standards has now shifted the focus to delivering good quality, user centred, value for money digital services.

We need to communicate digitally by default. This means a fundamental focus on the citizen and their needs, designing for a wide range of differing digital skills and competencies to make their journeys intuitive and as inclusive as possible.

Accessibility is a critical aspect of any digital website or service and we needed a wider, more flexible, high-contrast colour palette to help us create good, accessible user interface and print design.

The eight core house colours are still used across all council design, the darker high-contrast colours less so. Looking at both digital and print design we create, the house colours are often combined with complementary but not always high-contrasting colours. These combinations often fail to pass level AA for colour contrast. This is something we’re keen to tackle across all our design to make information more accessible to service users.

What does level AA and AAA mean? To go into a bit of detail the Web Content Accessibility Guidelines (WCAG) 2.0 level AA requires a colour contrast ratio of 4.5:1 for normal text and 3:1 for large text. Level AAA requires a contrast ratio of 7:1 for normal text and 4.5:1 for large text. Large text is defined as 14 point (typically 18.66px) and bold or larger, or 18 point (typically 24px) or larger.

Our goal is to make sure text and background colour contrasts pass level AA as a minimum but ideally level AAA. We are working iteratively towards making content on all Devon County Council websites accessible to people with a diverse range of visual, hearing, cognitive and motor impairments. A high-contrast colour palette plays a vital role in achieving this. When good contrast in user interface design is overlooked it can create barriers excluding people from accessing information.

We used the original DCC colour palette as a starting point to build the wider palette. The extended palette now offers dark, light and bright hues and tints. The darkest and lightest colours can be used together. To make sure each new hue or tint, when combined with black or white, met level AAA we have checked every hex code against an online colour contrast checker tool.

Staff or partners wishing to combine the DCC colour palette with additional colours should use a colour contrast checker at https://snook.ca/technical/colour_contrast/colour.html or http://webaim.org/resources/contrastchecker/ to check they pass level AA or AAA.

Be the first to Comment

Your email address will not be published. Required fields are marked *

Comments are held for moderation. House rules