#BAD5DF

#BAD5DF

Color Values

HEX

#BAD5DF

RGB

186, 213, 223

HSL

196.2, 36.6%, 80.2%

HSV

196.2, 16.6%, 87.5%

CMYK

16.6%, 4.5%, 0.0%, 12.5%

OKLCH

0.8562 0.032 222.1

Properties

Cool Light Nearest: lightblue

Color Harmonies

Complementary

#BAD5DF

#DFC4BA

Analogous

#BADFD6

#BAC3DF

#BAD5DF

Triadic

#BAD5DF

#DFBAD5

#D5DFBA

Split Complementary

#BAD5DF

#DFBAC3

#DFD6BA

Tetradic

#BAD5DF

#D6BADF

#DFC4BA

#C3DFBA

Color Blindness Simulation

Original

#BAD5DF

Protanopia

#C6C6DD

Deuteranopia

#C4C2DC

Tritanopia

#BBDBDA

Achromatopsia

#D0D0D0

CSS Usage

background-color: #BAD5DF;
color: #BAD5DF;
border-color: #BAD5DF;
Nearest Tailwind: Slate 300 #CBD5E1

Tailwind Shades

50
#F5F8FA
100
#E8F0F3
200
#CEE1E8
300
#ABCCD8
400
#7EB1C3
500
#5195AE
600
#41778B
700
#345F6F
800
#284A57
900
#203840
950
#152329

Contrast Checker

Text on white

1.54:1

AA Fail AAA Fail

Text on black

13.67:1

AA Pass AAA Pass

Related Articles

Tutorials

Building a Color Picker Web Component from Scratch

Feb 20, 2026
Tutorials

Web Color Performance: Gradients, Shadows, and Filters

Feb 19, 2026
Tutorials

Tailwind CSS Colors: Complete Shade System Guide

Feb 19, 2026