Web-Safe Colours

Features

• All 216 colours, grouped by hue, each with a swatch
• Every colour in both six-digit and three-digit shorthand form
• RGB and HSL as well, ready to paste into a stylesheet
• Enter any colour to find out whether it is web-safe
• If it is not, the nearest web-safe colour and how far off it is
• The three channel values are shown — which is the answer to why the shorthand always works
• Short form (#f00) and long form (#ff0000) both work, in either case
• Each colour states whether black or white text reads better, with the WCAG contrast ratio
• All 216 values sit in one searchable dropdown, grouped by hue
• Empty input shows the whole palette as a reference chart
• Paste tolerance: quotation marks and full-width characters around a value do not break the lookup
• Values copy row by row, for dropping into a design file or code

How to use

1. Type a colour value, such as #f00 or #336699
2. The result gives the long form, the shorthand, RGB, HSL, the channel values, and which text colour reads better
3. Type a colour that is not in the palette, such as #123456, and it gives the nearest one with its distance
4. Leave the box empty to list all 216 colours grouped by hue

FAQ

Does the web-safe palette still matter?

As a technical constraint, no — and it is worth being straight about that. Its premise was displays that could only produce 216 colours, and any screen today shows far more, so it is no longer needed to guarantee a colour renders the same everywhere. What it is still good for is three other things. It is evenly spaced: six levels per channel makes a very regular ready-made palette, so you are unlikely to pick several colours that crowd each other. It is expressible in shorthand, so `#f00` is shorter and easier to remember than `#ff0000`. And it is consistent across tools: a lot of older systems, charting libraries and terminal themes use exactly this set. Treat it as a convenient palette, not a compliance checklist.

Why can all 216 be written in three-digit shorthand?

Because each channel takes only six values: 0, 51, 102, 153, 204 and 255. In hex those are `00`, `33`, `66`, `99`, `cc` and `ff` — both digits identical — so every digit in the six-digit form is a repeat and half of them can be dropped. The converse holds too: if a colour has a shorthand, then expanding each of its three digits gives a doubled pair, so its channel values must be among those six. The two conditions imply each other, which is why "has a shorthand" and "is web-safe" describe the same set of colours.

How is the "nearest" colour chosen?

By a weighted distance in RGB space (the redmean formula): a difference of 255 counts for more in the green channel than in the blue, because the eye is most sensitive to green and least to blue. Plain Euclidean distance — treating all three channels alike — regularly returns a nearby colour that visibly looks wrong. The more accurate CIEDE2000 standard is not used because the job here is picking one of 216 candidates, which redmean already does to within the eye, in three lines that are hard to get wrong.

What unit is the distance in?

None. It is the value produced by the formula above and is only meaningful when compared with other values from the same formula: closer to 0 means more alike, larger means further apart. It is not a ΔE from any colour-science standard, so do not compare it with numbers from other tools — change the distance formula and the number for the same pair changes too. Its only job is to say how close the nearest match actually is.