Color tools

Black color codes

Black color codes for #000000 — HEX, RGB, HSL, HSV, shades, named blacks, and copy-ready CSS. Free online tool — no sign-up. Runs locally in your browser.

Loading tool…

Loading Preparing tool…

How to use

Explore the base color

Review HEX, RGB, HSL, and HSV for black, then browse shades, tints, tones, and hues.

Pick a variation or named shade

Click a generated strip or a CSS named black shade to load codes and harmonies.

Copy for CSS

Copy HEX, rgb(), hsl(), or the keyword—and check contrast on white and black.

Color formulas

Core relationships used by this color tool.

CSS black#000000 = rgb(0, 0, 0) = hsl(0°, 0%, 0%)

Shadesame H/S, lower L (mix toward black)

Tintsame H/S, higher L (mix toward white)

ComplementH + 180° (any light accent)

iHSV (or HSB) keeps hue with saturation and value; HSL uses lightness. Named shades in this family follow CSS Color Module keywords.

Example colors

Common picks with formula and result.

Base black

CSS keyword

color: black;

#000000 · rgb(0, 0, 0)

Related shade

Family neighbor

dimgray

#696969

UI accent

Background use

background-color: #000000;

Pair with readable text

Complement direction

Harmony hint

H + 180°

Toward any light accent

Black color family specification

Version 1.0.1 · Engine tested

Calculation status

Engine tested 4 published cases
Named expert review Not performed
Calculation version 1.0.1

Review policy

Definition: Black in CSS centers on the keyword black (#000000 / rgb(0, 0, 0) / hsl(0°, 0%, 0%)). Designers use black families for authority, contrast, and minimalism on screens.
What it calculates: Black family variations (shades, tints, tones, hues), named CSS shades, harmony sets, HEX/RGB/HSL/HSV codes, and contrast vs white/black.
Inputs: Selected variation chip, named shade, or harmony swatch
Section mode (variations, named shades, harmonies)
Outputs: HEX, RGB, HSL, HSV
Optional CSS keyword
Contrast ratios on white and black
Formula: Shades/tints/tones adjust HSL L or S from base H; harmonies offset H on the hue circle
Black anchors typography and dark mode. Use soft grays for secondary content to avoid stark walls of ink.

For full keyword search across all hues, use HTML color codes. For palette generation, try the color scheme generator or color wheel.

:root { --black: #000000; --ink: #111111; --muted: #696969; } .banner { background-color: var(--black); color: #ffffff; }
Popular CSS blacks: Name HEX RGB Feel
black #000000 0, 0, 0 Base keyword
dimgray #696969 105, 105, 105 Dark shade
gray #808080 128, 128, 128 Named shade
darkslategray #2F4F4F 47, 79, 79 Dark shade
midnightblue #191970 25, 25, 112 Dark shade
silver #C0C0C0 192, 192, 192 Named shade
white #FFFFFF 255, 255, 255 Named shade
darkgray #A9A9A9 169, 169, 169 Dark shade
darkgrey #A9A9A9 169, 169, 169 Dark shade
darkslategrey #2F4F4F 47, 79, 79 Dark shade
dimgrey #696969 105, 105, 105 Dark shade
gainsboro #DCDCDC 220, 220, 220 Named shade
i Related hues may appear in Named shades when useful for black-adjacent palettes.
Assumptions: Base keyword black = #000000 in sRGB.
Named list uses CSS Color Module keywords in/near the black family.
Tool runs locally; nothing is uploaded.
Units: HEX: #RRGGBB
RGB: 0–255
HSL/HSV: hue degrees; S/L/V percent
Boundary conditions: Lightness/saturation steps stay within visible ranges (~0–100%).
Hue offsets wrap modulo 360°.
Example: black → #000000; complementary toward any light accent
Validation cases: black → #000000
dimgray → #696969
shade of black → same hue, lower lightness
tint of black → same hue, higher lightness
Sources: CSS Color Module named colors (black family)
Classical shade/tint/tone and hue-harmony geometry
WCAG relative-luminance contrast
Calculation version: 1.0.1

Name	HEX	RGB	Feel
black	#000000	0, 0, 0	Base keyword
dimgray	#696969	105, 105, 105	Dark shade
gray	#808080	128, 128, 128	Named shade
darkslategray	#2F4F4F	47, 79, 79	Dark shade
midnightblue	#191970	25, 25, 112	Dark shade
silver	#C0C0C0	192, 192, 192	Named shade
white	#FFFFFF	255, 255, 255	Named shade
darkgray	#A9A9A9	169, 169, 169	Dark shade
darkgrey	#A9A9A9	169, 169, 169	Dark shade
darkslategrey	#2F4F4F	47, 79, 79	Dark shade
dimgrey	#696969	105, 105, 105	Dark shade
gainsboro	#DCDCDC	220, 220, 220	Named shade

Frequently asked questions

Key distinctions behind the tool.

What is the hex code for black?

The CSS named color black is #000000, equal to rgb(0, 0, 0) and hsl(0°, 0%, 0%).

What is the difference between black and dimgray?

Black is absolute #000000. DimGray is a softer dark for secondary text and icons.

What colors go with black?

White, neon accents, and gold on black feel bold. Soft gray text reduces harshness. Always check text contrast.

Is black good for body text?

Black on white is maximum contrast. Prefer off-black (#111–#222) if pure black feels too harsh on large screens.

How do I use black in CSS?

Use color: black;, color: #000000;, or color: rgb(0, 0, 0); on any property that accepts a <color> value, including background-color and border-color.