Text to colour — the same name always gets the same colour

How to use the text to colour hash

1. Type your text into Text.
2. Choose the Method: Readable (hue from FNV-1a) or Raw (first 3 bytes of SHA-256).
3. In Readable mode, set Saturation and Lightness (0–100%). Defaults are 65% and 50%.
4. Copy the Colour in hex. Readable mode also shows the Hue and the full HSL; Raw mode shows the RGB values.

What it does and when to use it

Chat apps, issue trackers and dashboards often give each user or tag its own colour. Choosing colours at random means storing them; hashing the text means the colour can be recomputed anywhere, on any device, and stays the same forever. Use this page to preview the colour a name will get, to pick saturation and lightness values that look good with your theme, or to check that your own implementation matches.

Check that text will be readable on the colour with the colour contrast checker. For a planned set of colours instead of hashed ones, try the colour palette generator. The hash behind Readable mode is explained on the FNV hash page.

How it works

Readable. The text is encoded as UTF-8 and hashed with 32-bit FNV-1a. The unsigned result modulo 360 becomes the hue, in degrees. Your saturation and lightness complete an HSL colour, which is converted to a hex code. Changing lightness changes the hex but never the hue.

Raw. The text is hashed with SHA-256 and the first three bytes of the digest are used directly as red, green and blue.

Neither mode is used for security here; the hash is just a reliable way to turn text into a number. Everything runs in your browser.

Worked examples

One letter. a has the FNV-1a hash 3826002220. 3826002220 mod 360 = 340, so the tool shows Hue: 340 and, at 65% and 50%, Colour: #d22d64, a pinkish red.

Raw mode. The SHA-256 of abc starts with ba7816, so Raw gives #ba7816 and RGB: rgb(186, 120, 22), a brown-orange.

Darker for white text. Alice gets hue 143, which is #2dd26c at the default 50% lightness. Lowering Lightness to 35 keeps the same green hue but gives #1f934c, which works better behind white text.

Limits and tips

• Hue is an integer, so Readable mode can return only 360 different colours for a given saturation and lightness.
• Empty text still gives a colour, from the hash of zero bytes.
• Some hues look brighter than others at the same lightness; yellows and cyans at 50% are hard to read with white text.