Accessibility Color Wheel

Home
Color wheel
Top

Info on the purpose of this tool is available in my home page

Normal

This box shows the colors with normal vision.

Use:

Choose a foreground color by pointing the mouse over the wheel or the vertical grey gradation strip and click or, if you have a touch screen, just touch them. Then click the "Background" button and choose a background color the same way. If a checkmark becomes visible the color pair is good for accessibility. Otherwise change one color or both by selecting foreground or background with the buttons.

not ok

Normal

1*		2*
C		B
Contrast ratio

* You can enter an hex value (3 or 6 digits) in this box. Then just click Update

Share |

Algorithm (here's an explanation of the implemented algorithms)

Contrast ratio (WCAG 2 recommended)
Contrast / brightness difference (WCAG 1)

Values and examples

Deuteranope

1		2
C		B
Contrast ratio

Deuteranopia is insensitivity to green. This box simulates the vision of deuteranope (partially color blind) people.

Protanope

1		2
C		B
Contrast ratio

Protanopia is insensitivity to red. This box simulates the vision of protanope (partially color blind) people.

Tritanope

1		2
C		B
Contrast ratio

Tritanopia is very rare and is insensitivity to blue. This box simulates the vision of tritanope (partially color blind) people.

Accessibility Color Wheel version 2.5 by Giacomo Mazzocato
Based on the Color Wheel by Jemima Pereira

Tests by Thierry Tardif: Alpha Design and Julie Deganutti: Jade Black Design

This tool is licensed under a Creative Commons Attribution-Noncommercial-No Derivative Works 3.0 License.

Home

Home
Color wheel
Top