ColourPicker.app

Exact color reference

#1E2124 Color

A very dark, low-saturation blue-gray. Use the exact values below to reproduce it consistently in CSS, design tokens and interface mockups.

#1E2124sRGB

#1E2124 color values

HEX

#1E2124

RGB

rgb(30, 33, 36)

HSL

hsl(210, 9%, 13%)

OKLCH

oklch(24.590% 0.007 248.1)

Tints

Mixed toward white

#4B4D50
20% white
#787A7C
40% white
#A5A6A7
60% white
#D2D3D3
80% white

Shades

Mixed toward black

#181A1D
20% black
#121416
40% black
#0C0D0E
60% black
#060707
80% black

Text contrast on #1E2124

White is the stronger of the two standard text choices for this background.

Black text on #1E2124

1.30:1

WCAG AA: Fail · WCAG AAA: Fail

White text on #1E2124

16.18:1

WCAG AA: Pass · WCAG AAA: Pass

Use #1E2124 in CSS

Its low lightness makes #1E2124 useful as a dark surface or background when paired with sufficiently light text. Always verify the final foreground and background pair rather than relying on appearance alone.

Open Color ConverterCheck another pairingBuild a palette
CSS
:root {
  --color-1e2124: #1E2124;
}

.color-1e2124 {
  color: #1E2124;
}

.bg-1e2124 {
  background-color: #1E2124;
  color: #FFFFFF;
}
Large #1E2124 color swatch with its HEX, RGB and HSL values
Download this exact-color reference image.Download PNG

Frequently Asked Questions

What color is #1E2124?
#1E2124 is a very dark, low-saturation blue-gray made from red 30, green 33 and blue 36. The swatch on this page is rendered from that exact sRGB value.
What are the RGB and HSL values for #1E2124?
#1E2124 converts to rgb(30, 33, 36) and approximately hsl(210, 9%, 13%). The page also provides a copyable OKLCH value.
Should I use black or white text on #1E2124?
White provides substantially stronger contrast on #1E2124 than black. Check the measured ratios on this page and test any other foreground color in the Contrast Checker.
How do I use #1E2124 in CSS?
Use declarations such as background-color: #1E2124 or store the value in a custom property such as --color-surface-dark: #1E2124.