Pure black at a glance
| Format | Value |
|---|---|
| Hex | #000000 (shorthand #000) |
| RGB | rgb(0, 0, 0) |
| HSL | hsl(0, 0%, 0%) — any hue, 0% lightness |
| CSS keyword | black |
| With transparency | #00000080 = rgb(0 0 0 / 50%) |
| Relative luminance | 0 (the darkest possible sRGB colour) |
Is black #fff or #000?
Black is #000. Each pair of hex digits is the amount of red, green and blue light, from 00 (none) to ff (full). No light at all is black; all three channels at full, #fff / #ffffff, is white.
Near-black shades with contrast ratios
Contrast ratios are calculated with the WCAG 2 formula against the text colour shown. WCAG AA needs 4.5:1 for body text and 3:1 for large text; AAA needs 7:1 for body text.
| Swatch | Hex | RGB | HSL lightness | vs #ffffff | vs #e8e8e8 | Typical use |
|---|---|---|---|---|---|---|
#000000 | 0, 0, 0 | 0% | 21:1 | 17.1:1 | True black, OLED themes, video letterbox | |
#0a0a0a | 10, 10, 10 | 4% | 19.8:1 | 16.2:1 | Near-black page background | |
#101010 | 16, 16, 16 | 6% | 19.0:1 | 15.5:1 | Near-black page background | |
#121212 | 18, 18, 18 | 7% | 18.7:1 | 15.3:1 | Material Design dark-theme surface | |
#0d1117 | 13, 17, 23 | 7% (blue tint) | 18.9:1 | 15.5:1 | Blue-black, GitHub dark background | |
#181818 | 24, 24, 24 | 9% | 17.8:1 | 14.5:1 | Cards on a near-black page | |
#1c1c1e | 28, 28, 30 | 11% | 17.0:1 | 13.9:1 | iOS dark-mode secondary background | |
#222222 | 34, 34, 34 | 13% | 15.9:1 | 13.0:1 | Raised panels, menus | |
#333333 | 51, 51, 51 | 20% | 12.6:1 | 10.3:1 | Dark grey; borders and inputs on black | |
#36454f | 54, 69, 79 | 26% (blue-grey) | 9.9:1 | 8.1:1 | Charcoal |
Every row passes AAA for white or light-grey body text. The practical difference between them is not compliance but comfort: pure white on pure black (21:1) produces the most halation, which is why many dark themes pair #0a0a0a–#121212 with off-white text. Pure black vs near-black explains the reasoning; black backgrounds in web design covers contrast for links, borders and muted text.
Grey text on black: what still passes
Muted text is where dark themes usually fail. Against #000000, #a8a8a8 gives 8.8:1 and #767676 gives 4.6:1 (just passing AA). Move the background up even slightly and the same grey fails: #767676 is 4.4:1 on #0a0a0a and 3.9:1 on #181818. Lift muted text to around #8a8a8a (5.1:1 on #181818) or lighter.
Black for OLED themes
On OLED displays a pixel showing #000000 is switched off, so "true black" or "AMOLED" themes use exactly #000000 for the page background. Near-blacks like #0a0a0a keep the pixels lit at a very low level — they still look black and still use little power, but they are not fully off. Use pure black when the goal is the OLED effect itself (battery, infinite contrast in a dark room); use a near-black when long-form readability matters more.
Black in print vs on screen
Hex codes describe light on a screen. Print uses ink, where a "rich black" mixes cyan, magenta and yellow under 100% black (one common recipe is C60 M40 Y40 K100) for a deeper solid than black ink alone. Avoid "registration" black (100% of all four inks) for large areas — it oversaturates paper. Ask your printer for their preferred rich-black values before sending a brochure or poster with a black background.
Using these values
:root {
--bg: #0a0a0a; /* page */
--surface: #181818; /* cards */
--text: #e8e8e8;
--muted: #a8a8a8;
}
body { background: var(--bg); color: var(--text); }
More recipes, including full-height backgrounds and black sections, are on how to make a black background in CSS. To get any of these as an image, enter the hex value on the solid background download page, or open the generator and set the lightness slider (0% is pure black, 4% is roughly #0a0a0a).
Last reviewed on 3 October 2026.
← Back to generator