#54baef

Color #54baef

A vivid, highly saturated light blue.

Closest named color Deep Sky Blue #00bfff · ΔE 8.47 Nearest Tailwind class sky-400 #00bcff · ΔE 3

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

Conversions

HEX

#54baef

RGB

rgb(84, 186, 239)

HSL

hsl(200.5, 82.9%, 63.3%)

HSV / HSB

hsv(200.5, 64.9%, 93.7%)

CMYK

cmyk(64.9%, 22.2%, 0%, 6.3%)

LAB

lab(71.71, -13.68, -35.11)

LCH

lch(71.71, 37.68, 248.71)

OKLCH

oklch(75%, 0.1212, 234.37)

HWB

hwb(200.5, 32.9%, 6.3%)

Harmony colors

Complementary

#ef8954

Analogous

#54efd6

#54baef

#546cef

Triadic

#54baef

#ef54ba

#baef54

Split-complementary

#54baef

#ef546c

#efd654

Tetradic

#54baef

#8954ef

#ef8954

#baef54

Square

#54baef

#d654ef

#ef8954

#6cef54

Shades

Color #54baef mixed toward black.

#23a6ea

#1288c5

#0e6694

#094462

#052231

Tints

Color #54baef mixed toward white.

#70c5f2

#8dd1f4

#a9dcf7

#c6e8fa

#e2f3fc

Tones

Color #54baef mixed toward gray.

#61b6e2

#6eb2d5

#7baec8

#88aabb

#94a6ae

Accessibility

Aa White text on this color

2.18:1

Aa Black text on this color

9.65:1

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

Under color vision deficiencies

Protanopia

#8c8de4 · ΔE 22

Deuteranopia

#867ee1 · ΔE 25.2

Tritanopia

#5ddad8 · ΔE 19.5

Achromatopsia

#b0b0b0 · ΔE 20.9

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

Code

CSS

background-color: #54baef;

Tailwind (arbitrary value)

bg-[#54baef]

Related colors

Light Sky Blue #87cefa

Sky Blue #87ceeb

Charcoal #36454f

Deep Sky Blue #00bfff

Light Blue #add8e6

Steel Blue #4682b4

Frequently asked questions

#54baef (#54baef) is rgb(84, 186, 239) in RGB.

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

Generate a palette → Check contrast