#97BBDD#97BBDD

#97BBDD is a light, moderate cyan. Relative luminance 0.473; OKLCH L 77.8% C 0.062 H 247.2°. Best body text is #000000 at 10.47:1 contrast (WCAG AA passes).

Color values

HEX	#97BBDD
RGB	rgb(151, 187, 221)
HSL	hsl(209, 51%, 73%)
HSV	hsv(209, 32%, 87%)
CMYK	cmyk(31.7%, 15.4%, 0%, 13.3%)
CIE-LAB	lab(74.41, -4.13, -20.94)
CIE-LCH	lch(74.41, 21.34, 258.86°)
OKLab	oklab(77.76% -0.0242 -0.0575)
OKLCH	oklch(77.76% 0.062 247.2)
XYZ	xyz(43.5800, 47.3385, 75.2336)
Luminance	0.4734 (WCAG relative)
Temperature	cool
Family	cyan

Closest named colors

Perceptual scales

Shades

Tints

Tones

OKLCH scale

Color harmonies

complementary

#97BBDD #DDB997

analogous

#97DDDC #97BBDD #9798DD

triadic

#97BBDD #DD97BB #BBDD97

tetradic

#97BBDD #DC97DD #DDB997 #98DD97

square

#97BBDD #DC97DD #DDB997 #98DD97

split-complementary

#97BBDD #DD9798 #DDDC97

monochromatic

#3D7FBC #699DCE #97BBDD #C5D9EC #E8F0F7

Accessibility & contrast

On white

2.01

#97BBDD on #FFFFFF

AA ✗AA large ✗AAA ✗

On black

10.47

#97BBDD on #000000

AA ✓AA large ✓AAA ✓

Best text color

#000000 on #97BBDD

10.47:1 — WCAG AA (normal text) passes

Contrast matrix

fg \ bg	##97BBDD	#FFFFFF	#000000	##000000
##97BBDD	1.00	2.01	10.47	10.47
#FFFFFF	2.01	1.00	21.00	21.00
#000000	10.47	21.00	1.00	1.00
##000000	10.47	21.00	1.00	1.00

Color blindness preview

Protanopia (red-blind)

#AEBBDF

Deuteranopia (green-blind)

#A5B4DC

Tritanopia (blue-blind)

#81C3C6

Achromatopsia (no color)

#B7B7B7

Design tokens & code

CSS

--color: #97bbdd;
/* rgb */ color: rgb(151, 187, 221);
/* oklch */ color: oklch(77.8% 0.062 247.2);

Tailwind

colors: {
  custom: {
    50: '#b7cfe7',
    500: '#97bbdd',
    950: '#000000',
  },
}

SCSS

$custom: #97bbdd;
$custom-light: #b7cfe7;
$custom-dark: #000000;

JSON

{
  "hex": "#97bbdd",
  "rgb": {
    "r": 151,
    "g": 187,
    "b": 221
  },
  "hsl": {
    "h": 209.143,
    "s": 50.725,
    "l": 72.941
  },
  "oklch": {
    "l": 0.77755,
    "c": 0.06241,
    "h": 247.2
  },
  "luminance": 0.4734
}

Semantic roles & 50–950 ramp

primary

#97BBDD

secondary

#EFE5DC

accent

#7127BE

background

#FBFCFE

surface

#F6F9FC

border

#D0D2D5

text

#111316

muted

#808284

Preview Lab

Preview with #97BBDD

Body copy rendered with the generated semantic roles for this colour.

Preview Lab → · Contrast checker → · Palette generator →