about spectRa
built by someone who actually needs it.
the backstory
i've known i was red-green color blind since i was a kid. most of the time it's fine. you learn to adapt, you pick up on context clues, and you mostly get by.
but occasionally something breaks through and reminds you. recently i was playing a game where progress depended on telling red and green apart. the colors were close enough in brightness that i genuinely couldn't figure out which path to take. it wasn't a bug. it was just a design decision that never considered that 1 in 12 men can't reliably distinguish those two colors.
that kind of thing is fixable. it doesn't take much: a slightly different hue, a small contrast bump, an icon alongside the color. designers just need to know the problem exists, and have tools that make checking easy.
why i built this
my major was cognitive science, with a focus in design. so i had both the personal motivation and the background to actually think through the problem properly.
most color accessibility tools i found were either too simplistic (just a contrast number) or too technical for designers who aren't deep into accessibility standards. i wanted something that was honest about the science, visual enough to actually show the problem, and simple enough that you didn't need to already know what you were doing to use it.
spectRa is that tool. everything runs in your browser. nothing is uploaded. it's free and always will be.
what spectRa does
contrast checker
pick any two colors and see if they meet readability standards for body text and headings. the ratio tells you how much brightness difference exists between them.
color blindness simulation
see your color pair as it appears across six types of color vision, including the most common red-green forms. contrast ratios update automatically for each simulation.
palette analysis
test a full set of colors at once. a color confusion map shows which pairs are hard to distinguish under color blindness, with suggested replacements for problem pairs.
image simulator
upload any image and drag a curtain slider to compare the original side by side with how it looks under different types of color blindness. nothing leaves your device.
privacy
all computation happens locally in your browser using javascript. no images, colors, or palette data are ever sent to a server. there are no accounts, no analytics, and no tracking of any kind.