Jump to content

User:RexxS/AAAcolour

From Wikipedia, the free encyclopedia

Following a discussion with Pigsonthewing, I'll assemble a table of colours that are WCAG AAA compatible with normal black text at up to 14pt (equal to 18px).

In each row, the "base colour" is the hue.

The last column is the darkest shade of that hue which meets the full WCAG AAA standard for (i) Brightness Difference, (ii) Colour Difference, (iii) Contrast Ratio, as measured by Snook's Colour Contrast Check.

Any colour of that hue with RGB values greater than those given will automatically be AAA compliant as well.

Note: none of these, except 'yellow', are AAA compatible, if the black text is replaced with link text (in Vector skin #0645AD ( ).

WCAG AAA compatible colours against black
base colour name base colour base colour in hex base colour hue darkest AAA colour
red #FF0000
#FF7B7B
orange #FF8000 30°
#FFA74F
yellow #FFFF00 60°
#FAFA00
chartreuse #80FF00 90°
#A8FF4F
green #00FF00 120°
#7BFF7B
spring green #00FF80 150°
#4FFFA8
cyan #00FFFF 180°
#00FAFA
dodger blue #0080FF 210°
#4FA8FF
blue #0000FF 240°
#8888FF
electric indigo #8000FF 270°
#BB76FF
magenta #FF00FF 300°
#FF28FF
deep pink #FF0080 330°
#FF52A9
grey #808080 -
#A7A7A7

With acknowledgement to Color Name & Hue for the names of the colours.

To do:

  • darkest AAA compliant colours against #0645AD and 0B0080 (for links)
  • lightest AAA compliant colours against white text (no links)