#397d84

Color #397d84

A muted dark cyan.

Closest named color Teal #008080 · ΔE 9.78 Nearest Tailwind class teal-700 #00786f · ΔE 9

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

Conversions

HEX

#397d84

RGB

rgb(57, 125, 132)

HSL

hsl(185.6, 39.7%, 37.1%)

HSV / HSB

hsv(185.6, 56.8%, 51.8%)

CMYK

cmyk(56.8%, 5.3%, 0%, 48.2%)

LAB

lab(48.51, -19.25, -10.33)

LCH

lch(48.51, 21.85, 208.22)

OKLCH

oklch(54.9%, 0.0692, 204.42)

HWB

hwb(185.6, 22.4%, 48.2%)

Harmony colors

Complementary

#844039

Analogous

#398466

#397d84

#395884

Triadic

#397d84

#84397d

#7d8439

Split-complementary

#397d84

#843958

#846639

Tetradic

#397d84

#403984

#844039

#7d8439

Square

#397d84

#663984

#844039

#588439

Shades

Color #397d84 mixed toward black.

#30686e

#265358

#1d3f42

#132a2c

#0a1516

Tints

Color #397d84 mixed toward white.

#49a1aa

#6ab7bf

#8fc9cf

#b4dbdf

#daedef

Tones

Color #397d84 mixed toward gray.

#3f787e

#467378

#4c6e71

#52696b

#586465

Accessibility

Aa White text on this color

4.73:1

Aa Black text on this color

4.44:1

White text reads better on this background (4.73:1). That passes WCAG AA (≥4.5:1) for normal-size text, but not AAA.

Under color vision deficiencies

Protanopia

#5e5f82 · ΔE 24.9

Deuteranopia

#5a5582 · ΔE 27.2

Tritanopia

#3f8181 · ΔE 3.4

Achromatopsia

#737373 · ΔE 18

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

Code

CSS

background-color: #397d84;

Tailwind (arbitrary value)

bg-[#397d84]

Related colors

Powder Blue #b0e0e6

Cadet Blue #5f9ea0

Dark Turquoise #00ced1

Aqua #00ffff

Azure #f0ffff

Dark Cyan #008b8b

Frequently asked questions

#397d84 (#397d84) is rgb(57, 125, 132) in RGB.

No, #397d84 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 #397d84, or check how it holds up for accessibility.

Generate a palette → Check contrast