Colour palette
The FedUni website colour palette is based on a range of blues and greys to coordinate with the FedUni logo.
Colour contrast and accessibility
FedUni corporate blue #041243 |
FedUni corporate grey #4d4d4f |
When used in combination, some colours on a website can cause problems for people with a visual impairment. Coloured text on buttons or blocks should be carefully considered to ensure there is sufficient contrast.
There are also legal imperatives for us to make our pages as accessible as possible. The World Wide Web Consortium (W3C) Web Content Accessibility Guidelines (WCAG) 2.1 sets the benchmark for our website. We aim to achieve AA compliance.
View Web Content Accessibility Guidelines 2.1
Colours can be checked for their contrast and to see if they are WCAG 2.1 AA compliant using the Snook Colour Contrast Check Tool.
This tool allows you to specify a foreground and a background colour and determine if they provide enough of a contrast "when viewed by someone having colour deficits or when viewed on a black and white screen" [W3C].
The WCAG contrast ratio formula differentiates between text smaller or larger than 18pt. In some cases coloured text larger than 18pt on a coloured background will be AA compliant but will not be compliant when smaller than this.
Secondary colour palette
PMS 282 100 / 90 / 20 / 60 4 / 18 / 67 #041243 | PMS cool grey 11 0 / 0 / 0 / 85 77 / 77 / 79 #4d4d4f | PMS 330 90 / 21 / 60 / 65 0 / 83 / 76 #00534c | PMS 186 10 / 100 / 100 / 5 207 / 31 / 37 #cf1f25 | Process cyan 100 / 0 / 0 / 0 0 / 174 / 239 #00aeef |
PMS 2945 110 / 53 / 2 / 16 0 / 76 / 151 #004c97 | PMS 429 0 / 0 / 0 / 50 115 / 128 / 138 #73808a | PMS 7748 20 / 2 / 86 / 50 124 / 128 / 52 #7c8034 | PMS 185 0 / 62 / 97 / 0 235 / 111 / 27 #eb6f1b | Process magenta 0 / 100 / 0 / 0 235 / 0 / 139 #ec008c |
PMS 538 14 / 4 / 1 / 3 197 / 207 / 218 #c5cfda | PMS 427 0 / 0 / 0 / 20 198 / 199 / 201 #c6c7c9 | PMS 397 14 / 2 / 100 / 15 176 / 174 / 36 #b0ae24 | PMS 130 0 / 36 / 100 / 0 235 / 164 / 17 #eba411 | Process yellow 0 / 0 / 100 / 0 255 / 255 / 0 #fff200 |