#304758

Color #304758

A muted dark blue.

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

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

Conversions

HEX

#304758

RGB

rgb(48, 71, 88)

HSL

hsl(205.5, 29.4%, 26.7%)

HSV / HSB

hsv(205.5, 45.5%, 34.5%)

CMYK

cmyk(45.5%, 19.3%, 0%, 65.5%)

LAB

lab(29, -3.76, -12.89)

LCH

lch(29, 13.43, 253.74)

OKLCH

oklch(38.6%, 0.0408, 241.11)

HWB

hwb(205.5, 18.8%, 65.5%)

Harmony colors

Complementary

#584130

Analogous

#305855

#304758

#303358

Triadic

#304758

#583047

#475830

Split-complementary

#304758

#583033

#585530

Tetradic

#304758

#413058

#584130

#475830

Square

#304758

#553058

#584130

#335830

Shades

Color #304758 mixed toward black.

#283b49

#202f3b

#18242c

#10181d

#080c0f

Tints

Color #304758 mixed toward white.

#466880

#5e88a7

#86a6bd

#aec3d3

#d7e1e9

Tones

Color #304758 mixed toward gray.

#334755

#374651

#3a464e

#3d454b

#414547

Accessibility

Aa White text on this color

9.69:1

Aa Black text on this color

2.17:1

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

Under color vision deficiencies

Protanopia

#3b3b54 · ΔE 12.6

Deuteranopia

#3a3853 · ΔE 13.9

Tritanopia

#315150 · ΔE 11.7

Achromatopsia

#444444 · ΔE 10.7

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

Code

CSS

background-color: #304758;

Tailwind (arbitrary value)

bg-[#304758]

Related colors

Charcoal #36454f

Steel Blue #4682b4

Alice Blue #f0f8ff

Light Sky Blue #87cefa

Dodger Blue #1e90ff

Light Slate Gray #778899

Frequently asked questions

#304758 (#304758) is rgb(48, 71, 88) in RGB.

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

Generate a palette → Check contrast