Posted on

Accessible Purples

Color contrast is not just about choosing the right colors, it is also about choosing the right text size. Some colors only work for large text while others can work for small and large text

  • Small Text: There is no definition for small text. 12 pt (16 px) is the best practice for smallest accessible text size.
  • Large text: 18 pt (24 px) or larger, 14 pt bold (18 px) or larger.
WCAG Accessible Purples, WCAG, Level AA
Background Color Swatch Hex Code RGB White Text Size Black Text Size
Hadley Purple Color Swatch #c2427B 194, 66, 123 Small & Large Large Only
Ashford Purple Color Swatch #c44099 196, 64, 153 Small & Large Small & Large
Hadley Purple Revised Color Swatch #c44A81 196, 74, 129 Small & Large Small & Large
Posted on

Accessible Blues

Color contrast is not just about choosing the right colors, it is also about choosing the right text size. Some colors only work for large text while others can work for small and large text

  • Small Text: There is no definition for small text. 12 pt (16 px) is the best practice for smallest accessible text size.
  • Large text: 18 pt (24 px) or larger, 14 pt bold (18 px) or larger.
WCAG Accessible Blues, WCAG, Level AA
Background Color Swatch Hex Code RGB White Text Size Black Text Size
TCTC Blue Color Swatch #007eb3 0, 126, 179 Small & Large Small & Large
Akea Blue Color Swatch #0c79c5 12, 121, 197 Small & Large Small & Large
AMCE Blue Color Swatch #128086 18, 128, 16 Small & Large Large Only
(Not Recommended)
OLEB Blue Color Swatch #4f71c5 79, 113, 197 Small & Large Small & Large

 

Posted on

Accessible Greens

Color contrast is not just about choosing the right colors, it is also about choosing the right text size. Some colors only work for large text while others can work for small and large text

  • Small Text: There is no definition for small text. 12 pt (16 px) is the best practice for smallest accessible text size.
  • Large text: 18 pt (24 px) or larger, 14 pt bold (18 px) or larger.
WCAG Accessible Greens, WCAG, Level AA
Background Color Swatch Hex Code RGB White Text Size Black Text Size
CRCL Red Medium Color Swatch #008557 0, 133, 87S Small & Large Large Only
Axess Green Color Swatch #00855d 0, 133, 93 Small & Large Small & Large
Deque Green Color Swatch #0e8813 14, 136, 19 Small & Large Small & Large
Equal Green Color Swatch #238067 35, 128, 103 Small & Large Large Only
Oswego Green Color Swatch #338552 51, 133, 82 Small & Large Small & Large

 

Posted on

Accessible Reds and Oranges

Color contrast is not just about choosing the right colors, it is also about choosing the right text size. Some colors only work for large text while others can work for small and large text

  • Small Text: There is no definition for small text. 12 pt (16 px) is the best practice for smallest accessible text size.
  • Large text: 18 pt (24 px) or larger, 14 pt bold (18 px) or larger.
Accessible Reds and Oranges, WCAG, Level AA
Background Color Swatch Hex Code RGB White Text Size Black Text Size
Moorehead Red Color Swatch #a6192e 166, 25, 46 Large & Small Not Accessible
CS Red 1 Color Swatch #b50000 181, 0, 0 Large & Small Not Accessible
Another Orange Red Color Swatch #c80a00 200, 10, 0 Large & Small Large Only
Yellow Never Looks Good Color Swatch #cf8102 207, 129, 2 Large Only Large & Small
Oneota Red Color Swatch #d53e42 213, 62, 66 Large & Small Large & Small
Oregon Orange Color Swatch #d73f09 215, 63, 9 Large & Small Large & Small
Forgotten Red Color Swatch #d8151b 216, 21, 27 Large & Small Large Only
2% / 1% Orange Color Swatch #db3900 219, 57, 0 Large & Small Large & Small
CRCL Red Dark Color Swatch #dd3333 221, 51, 51 Large & Small Large & Small
Perkins Red Color Swatch #eb0051 235, 0, 81 Large & Small Large & Small
BC Orange Color Swatch #ec1109 236, 17, 9 Large & Small Large & Small