FreeDev Tools

Color Blindness Simulator

See how hex colors appear with protanopia, deuteranopia, tritanopia, and achromatopsia.

Runs locally in your browser. Your input is not uploaded.

How to Use

  1. 1

    Paste your palette

    One hex color per line.

  2. 2

    Compare the simulations

    Each color shows its appearance under four vision types.

  3. 3

    Fix collisions

    Colors that converge need icons, labels, or different hues.

Frequently Asked Questions

Protanopia (no red cones), deuteranopia (no green cones — the most common), tritanopia (no blue cones), and achromatopsia (complete color absence) — using standard Viénot/Brettel-style matrices in linear RGB.

Related Tools

CSS Gradient GeneratorBuild linear and radial CSS gradients visuallyBox Shadow GeneratorCreate CSS box shadows with a live previewBorder Radius GeneratorGenerate CSS border-radius values visuallyFlexbox GeneratorBuild CSS flexbox layouts with a visual editorCSS Grid GeneratorBuild CSS grid layouts with a visual editorText Shadow GeneratorGenerate CSS text-shadow effects with live previewCSS Animation GeneratorCreate CSS keyframe animations with a live editorClip-Path GeneratorGenerate CSS clip-path polygon shapes visually