#677083

Color #677083

A nearly neutral, gray-leaning medium blue.

Closest named color Slate Gray #708090 · ΔE 6.61 Nearest Tailwind class gray-500 #6a7282 · ΔE 1.5

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

Conversions

HEX

#677083

RGB

rgb(103, 112, 131)

HSL

hsl(220.7, 12%, 45.9%)

HSV / HSB

hsv(220.7, 21.4%, 51.4%)

CMYK

cmyk(21.4%, 14.5%, 0%, 48.6%)

LAB

lab(47.12, 1.01, -11.59)

LCH

lch(47.12, 11.63, 274.98)

OKLCH

oklch(54.4%, 0.0316, 265.28)

HWB

hwb(220.7, 40.4%, 48.6%)

Harmony colors

Complementary

#837a67

Analogous

#677e83

#677083

#6c6783

Triadic

#677083

#836770

#708367

Split-complementary

#677083

#836c67

#7e8367

Tetradic

#677083

#7a6783

#837a67

#708367

Square

#677083

#83677e

#837a67

#67836c

Shades

Color #677083 mixed toward black.

#565d6d

#454b57

#333842

#22252c

#111316

Tints

Color #677083 mixed toward white.

#7e879a

#989fae

#b2b7c2

#cbcfd7

#e5e7eb

Tones

Color #677083 mixed toward gray.

#697181

#6c727e

#6e737c

#70737a

#737477

Accessibility

Aa White text on this color

4.97:1

Aa Black text on this color

4.22:1

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

Under color vision deficiencies

Protanopia

#6b6b7f · ΔE 4.8

Deuteranopia

#6a6a7e · ΔE 4.9

Tritanopia

#677b7a · ΔE 12.9

Achromatopsia

#707070 · ΔE 9.3

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

Code

CSS

background-color: #677083;

Tailwind (arbitrary value)

bg-[#677083]

Related colors

Cornflower Blue #6495ed

Royal Blue #4169e1

Light Steel Blue #b0c4de

Light Slate Gray #778899

Slate Gray #708090

Dodger Blue #1e90ff

Frequently asked questions

#677083 (#677083) is rgb(103, 112, 131) in RGB.

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

Generate a palette → Check contrast