What color is #36393E?

A dark cool grey with a slight blue cast — gunmetal. It is a common background value for dark-mode interfaces, dark enough to rest the eye without the harshness of pure black.

Is gunmetal the same as charcoal?

Close but not identical. Charcoal (#36454F) is lighter and noticeably bluer. Gunmetal is darker and closer to neutral, which is why it works better as a background than as a surface.

Why not use pure black for dark mode?

White text on pure black hits 21:1 contrast, which causes halation — text appearing to bleed into the background. It also removes any room for elevation, since a raised surface can only go lighter.

Gunmetal color: hex codes, shades and palettes

Palettes built around gunmetal. Click any swatch to copy its hex code.

Gunmetal is the cool dark grey used as the background of most dark interfaces — #36393E is a widely used value, dark enough to rest the eye but far enough from black to keep depth. It carries a slight blue cast, which is what separates it from a neutral charcoal.

#1E1513

#3B1E0D

#542B03

#5C4226

#9E8F00

#7B8748

#789C68

#2C834F

#C39E55

#A08400

#6F6F00

#47571C

#2C1223

#34262C

#4C3038

#5F4041

#404C63

#2B3B69

#283042

#1D232E

#536761

#3A4844

#242B2A

#0E1211

#002115

#162E27

#243E39

#11534C

#151613

#4F544D

#43433F

#5A575B

#AF9B7F

#857853

#5A5737

#323725

#0B0E0E

#202828

#394445

#5D6061

#00333E

#384B5C

#1A223A

#231F3B

#141921

#1D2843

#343B4D

#494C62

#4D5100

#4387B0

#A96388

#5F7428

#5F6362

#3A423F

#1D2221

#050606

#1A202F

#23232D

#160D25

#25122A

#33445D

#383A80

#12091F

#432342

#D9644D

#B46D30

#8C6A00

#818505

#184256

#0C3043

#0E2029

#041118

#8E5B58

#A36C4E

#976511

#5B512F

#857A00

#474D03

#6C6000

#4156AA

#596B71

#484C4E

#2F3031

#14181A

#444531

#1C1F06

#52450F

#474973

#3A1B0D

#3F3129

#603C18

#685236

#15131B

#2F1738

#42263F

#632B48

Gunmetal hex, RGB, HSL and OKLCH

#36393E

HEX: #36393E
RGB: rgb(54, 57, 62)
HSL: hsl(217, 7%, 23%)
OKLCH: oklch(34.4% 0.010 260.7)
On white: 11.59:1
On black: 1.81:1

Shades of gunmetal

Eleven steps from one base color, generated in OKLCH so each step is an equal perceived step rather than an equal numeric one. Click a swatch to copy it.

Named shades and close relatives

Why dark interfaces avoid pure black

Pure black backgrounds are harsh: white text on #000000 produces the maximum possible contrast, 21:1, which causes halation — the text appears to bleed into the background, particularly for people with astigmatism. Lifting the background a few percent to something like #36393E takes the edge off while keeping the interface dark.

It also restores depth. On pure black a raised surface has nowhere to go except lighter, so elevation stops reading. A dark grey base leaves room to place cards and modals above it and dividers below.

Building on gunmetal

The practical set is three or four steps: a base around #36393E, a slightly lighter surface for cards, a darker step for wells and inputs, and a border that is a lift of the base rather than a grey from somewhere else. The scale below gives all of those from one value.

Keep the blue cast consistent. Mixing a cool grey base with warm grey surfaces is a common and very visible mistake — the surfaces look dirty rather than lighter.

Contrast and readability

Gunmetal on white measures 11.59:1 and on black 1.81:1. WCAG AA asks for 4.5:1 on normal text and 3:1 on large text and UI components, so the higher of those two decides which background it belongs on. In the scale above, 500 is the first to clear 4.5:1 on white, at 5.27:1.

The contrast checker reports every level for a given pair and suggests the nearest passing shade on the same hue. The color picker builds this same scale from any color you paste in.

Gunmetal color questions

What color is #36393E?: A dark cool grey with a slight blue cast — gunmetal. It is a common background value for dark-mode interfaces, dark enough to rest the eye without the harshness of pure black.
Is gunmetal the same as charcoal?: Close but not identical. Charcoal (#36454F) is lighter and noticeably bluer. Gunmetal is darker and closer to neutral, which is why it works better as a background than as a surface.
Why not use pure black for dark mode?: White text on pure black hits 21:1 contrast, which causes halation — text appearing to bleed into the background. It also removes any room for elevation, since a raised surface can only go lighter.

Related colors:charcoal, damson. See every shade on the colors index.