Understanding Screen Colors and Accessibility

There are lots of accessibility myths out there, involving which color combinations are and aren't accessible: It's all about the level of contrast between the colors and the size of the text. WebAIM, a site which provides web accessibility solutions, has a Color Contrast checker available for anyone to use to check your text's accessibility.

http://webaim.org/resources/contrastchecker/

To use this tool, you need to understand a little about how colors can be named on a computer. Because of the way monitors show colors, colors are identified by the amount of Red, Blue, and Green in the color (RGB color). The value of each color varies from 0 (none) to 255 (as much as possible). Instead of writing out R: 255, B: 255 G: 255 (255,255,255) for white, some programs show this in something called hex code. Every color is coded in a 6 character combination with values from 0-9 and A-F - the first two characters are the Red, the next two are the Green, and the final two are the Blue. White is #FFFFFF and Black is #000000. Red would be #FF0000.

This would be simple enough (grab the RGB hex codes, you need and type them in the tool to compare) except that not all programs will give you the hex code - some will only give you the RGB values from 0 to 255, which is sometimes referred to as decimal code. If that happens to you (PowerPoint, for example, will give you decimal code under advanced color options but not the hex code) then you can use another tool to convert the colors to the code you need.

Here's an online tool that lets you put in RGB decimal values, or RGB hex values, or select a color by sight and gives you all the information about the color. Then you can take the hex codes to the WebAIM site to check color contrast for accessibility.

http://www.rapidtables.com/web/color/RGB_Color.htm