As part of a recent Social Media campaign we've put together a series of bite size digital accessibility tips. On this page you'll find the plain text version as well as a downloadable tagged PDF for each tip.
Web Key IT Accessibility Tip 001 - Can Your Red Be Read?
Copyright 2020 Web Key IT
Contributors: Amanda Mace and Karl McCabe
Red text is used for lots of things including highlighting new items, warnings, reminders of missing entries and asterisks to show that information is required (more on that use in another post). But there’s a problem…
The red we see used most is pure red. This red has a hex value of #FF0000 and RGB values of (255, 0, 0).
So what’s the issue with pure red?
Here’s the thing. It has a colour contrast ratio, with white, of only 4:1. This can be problematic when it comes to passing colour contrast requirements.
Okay. Well, what does a more accessible red look like? So glad you asked!
Here’s some we prepared earlier.
Darker red Hex #ee0000 RGB (238, 0, 0)
This darker red has a contrast ratio, with white, of 4.53 to 1 and passes WCAG at the A A level for all text sizes.
Deep red Hex #b60000 RGB (182, 0, 0)
This deep red has a contrast ratio, with white, of 7.03 to 1 and passes WCAG at the A A A level for all text sizes.
Feel free to share this post or save it for later. And follow us for more accessibility tips.
Brought to you by Web Key IT