Is Spectrum free to use?

Yes, Spectrum is completely free. There are no paid plans, no trial periods, and no features locked behind a paywall. All 7 tools are free for everyone, forever.

Do I need to create an account?

No account is needed. Open the site and start using any tool immediately. Your color history is saved to your browser locally, not to a server.

Are my images uploaded to a server?

No. Images are processed entirely in your browser using the HTML Canvas API. Your files never leave your device and are never sent to any server.

How do I extract colors from an image?

Upload an image (drag & drop, URL, or paste), then click anywhere on it to pick the color at that pixel. The color appears instantly in HEX, RGB, HSL, and more formats.

What is WCAG contrast ratio and why does it matter?

WCAG contrast ratio measures how different two colors look against each other. A ratio of at least 4.5:1 is required for normal text (AA level) to be readable by people with low vision. Spectrum's contrast checker tests your color pairs against all WCAG 2.1 levels.

What is color blindness and how common is it?

Color blindness (color vision deficiency) is a reduced ability to distinguish certain colors. About 8% of men and 0.5% of women are color blind in some way. The most common types are red-green (protanopia, deuteranopia) and blue-yellow (tritanopia). Spectrum simulates 7 types of color vision.

What are complementary colors?

Complementary colors sit directly opposite each other on the color wheel — red and green, blue and orange, yellow and purple. Placed side by side, they create the highest possible contrast and make each color appear more vivid.

What color formats does Spectrum support?

Spectrum supports HEX, RGB, RGBA, HSL, HSLA, HSV, HWB, CMYK, LAB, LCH, XYZ, YUV, YCbCr, HSI, and several technical formats like integer, binary, and Base64. You can copy any format with a single click.

Vision Simulator

Color Blindness Simulator

Visualize how your designs appear to people with different types of color vision deficiency.

Original Image

Upload an image to see the simulation

Drop an image or tap to upload

PNG, JPG, GIF up to 10MB

Simulated View

How the image appears with Deuteranopia

Upload an image to see simulation

Select Vision Type

Choose a type of color vision deficiency to simulate

Color Palette Preview

See how common colors appear with Deuteranopia

Original Colors

#FF0000

#00FF00

#0000FF

#FFFF00

#FF00FF

#00FFFF

#FFA500

#800080

Simulated (Deuteranopia)

#9FB300

#604D4D

#0000B3

#FFFF4D

#9FB3B3

#604DFF

#DDE432

#505A5A

Test Your Own Color

#6368B7

As seen with Deuteranopia

Colorblind-Safe Palettes

These color combinations work well for most types of color vision

Blue & Orange

#0077BB

#EE7733

Simulated:

Blue & Yellow

#0077BB

#CCBB44

Simulated:

Blue & Red

#004488

#BB5566

Simulated:

Teal & Magenta

#009988

#EE3377

Simulated:

Black & White

#000000

#FFFFFF

Simulated:

Blue & Light Gray

#332288

#DDDDDD

Simulated:

Design Tips for Accessibility

Best practices for creating colorblind-friendly designs

Don't rely on color alone

Use patterns, icons, or text labels alongside color to convey information.

Ensure sufficient contrast

Maintain high contrast ratios (4.5:1 minimum) between text and backgrounds.

Use colorblind-safe palettes

Choose colors that remain distinguishable across all vision types.

Test your designs

Regularly check how your work appears to users with color vision deficiency.

About Color Vision Deficiency

Color vision deficiency affects approximately 8% of men and 0.5% of women worldwide — over 300 million people globally.

Red-Green (Most Common)

Protanopia, Deuteranopia affect red and green perception.

Blue-Yellow (Rare)

Tritanopia affects blue and yellow perception.

Check contrast ratios for accessibility

Men affected

of males worldwide

0.5%

Women affected

of females worldwide

300M+

People globally

with some form of CVD

Red-Green

Most common

deuteranopia/protanopia

Color Blindness Simulator

Original Image

Simulated View

Select Vision Type

Protanopia

Protanomaly

Deuteranopia

Deuteranomaly

Tritanopia

Tritanomaly

Achromatopsia

Achromatomaly

Color Palette Preview

Colorblind-Safe Palettes

Design Tips for Accessibility

Don't rely on color alone

Ensure sufficient contrast

Use colorblind-safe palettes

Test your designs

About Color Vision Deficiency

Red-Green (Most Common)

Blue-Yellow (Rare)

Color Blindness Simulator

Original Image

Simulated View

Select Vision Type

Protanopia

Protanomaly

Deuteranopia

Deuteranomaly

Tritanopia

Tritanomaly

Achromatopsia

Achromatomaly

Color Palette Preview

Colorblind-Safe Palettes

Design Tips for Accessibility

Don't rely on color alone

Ensure sufficient contrast

Use colorblind-safe palettes

Test your designs

About Color Vision Deficiency

Red-Green (Most Common)

Blue-Yellow (Rare)