#313844

Color #313844

A muted dark blue.

Closest named color Charcoal #36454f · ΔE 6.18 Nearest Tailwind class gray-700 #364153 · ΔE 3.9

Open in Palette generator Color wheel Color mixer Contrast checker Blindness simulator Gradient

Conversions

HEX

#313844

RGB

rgb(49, 56, 68)

HSL

hsl(217.9, 16.2%, 22.9%)

HSV / HSB

hsv(217.9, 27.9%, 26.7%)

CMYK

cmyk(27.9%, 17.6%, 0%, 73.3%)

LAB

lab(23.33, 0.28, -8.39)

LCH

lch(23.33, 8.39, 271.91)

OKLCH

oklch(33.9%, 0.0232, 261.07)

HWB

hwb(217.9, 19.2%, 73.3%)

Harmony colors

Complementary

#443d31

Analogous

#314144

#313844

#333144

Triadic

#313844

#443138

#384431

Split-complementary

#313844

#443331

#414431

Tetradic

#313844

#3d3144

#443d31

#384431

Square

#313844

#443141

#443d31

#314433

Shades

Color #313844 mixed toward black.

#292f39

#21252d

#181c22

#101317

#08090b

Tints

Color #313844 mixed toward white.

#4c576a

#687790

#8d99ad

#b3bbc8

#d9dde4

Tones

Color #313844 mixed toward gray.

#333842

#343941

#36393f

#373a3e

#393a3c

Accessibility

Aa White text on this color

11.8:1

Aa Black text on this color

1.78:1

White text reads better on this background (11.8:1). That passes WCAG AAA (≥7:1) for normal-size text.

Under color vision deficiencies

Protanopia

#343441 · ΔE 4.3

Deuteranopia

#343341 · ΔE 5.1

Tritanopia

#313f3f · ΔE 9.3

Achromatopsia

#383838 · ΔE 7.1

Left half is the original, right half is the simulated appearance. See all 8 vision types →

Code

CSS

background-color: #313844;

Tailwind (arbitrary value)

bg-[#313844]

Related colors

Cornflower Blue #6495ed

Light Steel Blue #b0c4de

Royal Blue #4169e1

Light Slate Gray #778899

Slate Gray #708090

Dodger Blue #1e90ff

Frequently asked questions

#313844 (#313844) is rgb(49, 56, 68) in RGB.

No, #313844 is not web-safe. The nearest web-safe colors are among its tones and shades below.

Related tools

Colors

HEX to RGB Converter

Convert any HEX color code to its RGB and HSL equivalents, live, with copy-to-clipboard values.

Try it → Accessibility

Contrast Checker

Check the WCAG contrast ratio between any two colors, live, with AA/AAA pass-fail results.

Try it → Generators

Palette Generator

Generate complementary, analogous, triadic, split-complementary, tetradic, square, and monochromatic palettes from any base color.

Try it →

Build something with this color

Generate a full palette from #313844, or check how it holds up for accessibility.

Generate a palette → Check contrast