#b4dcf2

Color #b4dcf2

A vivid, highly saturated very light blue.

Closest named color Light Blue #add8e6 · ΔE 4.81 Nearest Tailwind class sky-200 #b8e6fe · ΔE 2.4

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

Conversions

HEX

#b4dcf2

RGB

rgb(180, 220, 242)

HSL

hsl(201.3, 70.5%, 82.7%)

HSV / HSB

hsv(201.3, 25.6%, 94.9%)

CMYK

cmyk(25.6%, 9.1%, 0%, 5.1%)

LAB

lab(85.65, -8.21, -15.03)

LCH

lch(85.65, 17.13, 241.35)

OKLCH

oklch(87.3%, 0.0519, 232.2)

HWB

hwb(201.3, 70.6%, 5.1%)

Harmony colors

Complementary

#f2cab4

Analogous

#b4f2e9

#b4dcf2

#b4bdf2

Triadic

#b4dcf2

#f2b4dc

#dcf2b4

Split-complementary

#b4dcf2

#f2b4bd

#f2e9b4

Tetradic

#b4dcf2

#cab4f2

#f2cab4

#dcf2b4

Square

#b4dcf2

#e9b4f2

#f2cab4

#bdf2b4

Shades

Color #b4dcf2 mixed toward black.

#78c0e8

#3ca4dd

#1f7fb4

#155578

#0a2a3c

Tints

Color #b4dcf2 mixed toward white.

#c0e2f4

#cde8f6

#d9edf8

#e6f3fb

#f2f9fd

Tones

Color #b4dcf2 mixed toward gray.

#b9daed

#bed9e8

#c3d7e2

#c9d6dd

#ced4d8

Accessibility

Aa White text on this color

1.45:1

Aa Black text on this color

14.46:1

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

Under color vision deficiencies

Protanopia

#c7c7ed · ΔE 16.7

Deuteranopia

#c4c1ec · ΔE 17.8

Tritanopia

#b6e9e8 · ΔE 10.9

Achromatopsia

#d6d6d6 · ΔE 13.5

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

Code

CSS

background-color: #b4dcf2;

Tailwind (arbitrary value)

bg-[#b4dcf2]

Related colors

Light Sky Blue #87cefa

Charcoal #36454f

Sky Blue #87ceeb

Steel Blue #4682b4

Deep Sky Blue #00bfff

Light Blue #add8e6

Frequently asked questions

#b4dcf2 (#b4dcf2) is rgb(180, 220, 242) in RGB.

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

Generate a palette → Check contrast