Shades of Black: Hex, RGB, and HSL Codes

What counts as a shade of black?

There is only one true black, #000000, and the other 11 entries below are the near-blacks that designers actually use: Charcoal #36454F, Onyx #353935, Jet Black #343434, Matte Black #28282B, Raisin Black #242124, and Licorice #1B1212 among them. Each keeps a trace of hue — Charcoal is blue, Licorice is red, Ebony #555D50 is green — and that trace is the whole point.

Pure #000000 against pure white is the highest contrast a screen can produce, and for long-form text it is generally too much: the glare makes edges buzz and tires the eye, especially on OLED displays where black pixels are genuinely off. Most careful designs set body text at #1B1B1B or #242124 instead and reserve true black for accents. The same rule holds in print, where a rich black mixed with other inks reproduces far better than 100% K alone.

How to use these color codes

1. Find your shade. The list runs roughly light to dark, with a live preview beside every name — scan it the way you would a paint chart.
2. Click a code to copy. Each row carries the hex, RGB, and HSL value of that color. One click copies that exact string to your clipboard.
3. Paste it into your project. Drop the hex into CSS, Figma, Photoshop, or a document. Clicking the swatch itself copies the hex, so you can grab colors without aiming at the small text.

What black communicates

Black is the most authoritative color available. It reads as premium, formal, and definitive, which is why luxury packaging, evening wear, and high-end electronics default to it — and why a black-and-white palette is the reliable fallback when a brand wants to look serious rather than friendly.

It is also the most context-dependent. In Western design black carries both mourning and sophistication with no ambiguity in practice, since the setting decides which one applies. In much of East Asia white fills the funerary role instead. Used heavily as a background, black makes colors placed on it appear more saturated, which is why it flatters product photography and why dark interface themes need their accent colors dialed back.

Honest limitations

A hex code is exact, but the color you see is not. The same #FF0000 looks different on an OLED phone, a cheap office monitor, and a printed page, because each device has its own gamut and calibration. Treat these values as a precise starting point for screens, and always check a physical proof before committing a color to print — CMYK cannot reproduce every shade listed here.

Color names are a mix of two things. Entries badged CSS are official CSS named colors: the name itself works in a stylesheet and every browser resolves it to exactly that hex. The rest are conventional names — Burgundy, Sage, Espresso — that no standards body owns. Their hex values follow the most widely cited convention, but another chart may place them a few percent lighter or darker, so quote the hex rather than the name when the exact value matters.

Why is it free?

FreeToGenerate.com keeps every tool genuinely free. This page is a static list of color values rendered in your browser — nothing to install, no account, no premium tier holding back the darker half of the palette. Copy as many codes as you need, as often as you need.

Other color families

redorangeyellowgreencyanbluepurplepinkbrowngraywhiteAll color families