#18366e

Color #18366e

A moderately saturated dark blue.

Closest named color Dark Slate Blue #483d8b · ΔE 18.21 Nearest Tailwind class blue-900 #1c398e · ΔE 5.1

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

Conversions

HEX

#18366e

RGB

rgb(24, 54, 110)

HSL

hsl(219.1, 64.2%, 26.3%)

HSV / HSB

hsv(219.1, 78.2%, 43.1%)

CMYK

cmyk(78.2%, 50.9%, 0%, 56.9%)

LAB

lab(23.53, 10.61, -35.76)

LCH

lch(23.53, 37.3, 286.53)

OKLCH

oklch(34.4%, 0.1038, 261.53)

HWB

hwb(219.1, 9.4%, 56.9%)

Harmony colors

Complementary

#6e5018

Analogous

#18616e

#18366e

#25186e

Triadic

#18366e

#6e1836

#366e18

Split-complementary

#18366e

#6e2518

#616e18

Tetradic

#18366e

#50186e

#6e5018

#366e18

Square

#18366e

#6e1861

#6e5018

#186e25

Shades

Color #18366e mixed toward black.

#142d5c

#102449

#0c1b37

#081225

#040912

Tints

Color #18366e mixed toward white.

#234fa2

#3169d2

#658fdd

#98b4e9

#ccdaf4

Tones

Color #18366e mixed toward gray.

#1f3867

#263a60

#2e3d59

#353f51

#3c414a

Accessibility

Aa White text on this color

11.72:1

Aa Black text on this color

1.79:1

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

Under color vision deficiencies

Protanopia

#282864 · ΔE 6.8

Deuteranopia

#262461 · ΔE 7.8

Tritanopia

#1a5b59 · ΔE 26.7

Achromatopsia

#383838 · ΔE 20.6

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

Code

CSS

background-color: #18366e;

Tailwind (arbitrary value)

bg-[#18366e]

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

#18366e (#18366e) is rgb(24, 54, 110) in RGB.

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

Generate a palette → Check contrast