Colours In Progress

N/A

To use a background or text colour use the .has-background- or .has-text- and one of the colour names above. For example, .has-background-primary.

The obbs-blue background colour name should only be used by Oxford Brookes Business School. Note, there is no obbs-blue text colour name.

It is important that our web pages meet web accessibility standards, including the minimum contrast ratios that the WCAG 2.1 specifies for text and background colour combinations. This helps users who are colour blind or have low vision, but it also improves usability and readability for all users.

We aim to for text and background colour combinations to comply to WCAG 2.1 Level AA. To meet this, we should make sure that the colour contrast on body text is 4.5:1 and 3:1 on large text (24px). In order to meet the guidelines at the stricter Level AAA, the contrast ratio must be at least 7:1 (or 4.5:1 for large text).

Some users have difficulty reading text when there is not enough contrast between foreground and background colours. In order to meet the W3C Web Content Accessibility Guidelines 2.1 Level AA, colours should be tested before publishing content.

We have used the following tools and information to achieve compliance:

• Web Aim's Colour Contrast Checker
• La Verou's Colour Contrast Analyser
• Material Design Color Tool
• Information on the use of colour from the WCAG 2.1 specification