one color in.
a whole palette out.
could not read that color. try #3b82f6, rgb(59 130 246), hsl(217 91% 60%) or oklch(62% 0.19 260).
palette
click a swatch to use it as text, shift-click for background, double-click to copy. the ▸ marks the step nearest your base.
preview
base and neutral scales dropped into a plain interface, light and dark. ratios are text on its own surface.
contrast
text
background
—:1
wcag 2.x ratio
| aa | aaa | |
|---|---|---|
| normal text | ||
| large text |
apca Lc —
the quick brown fox
large text, 24px regular / 18.66px bold
body copy at 16px. readable contrast keeps tired eyes on the page past the first paragraph, on bad screens and in bright rooms.
caption at 12px — fine print is where low contrast hurts first.
matrix
every step against white, black and each other. cell = text in the column color on the row color. bold passes aa, plain passes aa large, faded fails.