#97A9FC#97A9FC
#97A9FC is a light, vivid blue. Relative luminance 0.420; OKLCH L 75.4% C 0.121 H 273.8°. Best body text is #000000 at 9.40:1 contrast (WCAG AA passes).
Color values
| HEX | #97A9FC |
|---|---|
| RGB | rgb(151, 169, 252) |
| HSL | hsl(229, 94%, 79%) |
| HSV | hsv(229, 40%, 99%) |
| CMYK | cmyk(40.1%, 32.9%, 0%, 1.2%) |
| CIE-LAB | lab(70.86, 13.91, -43.24) |
| CIE-LCH | lch(70.86, 45.42, 287.83°) |
| OKLab | oklab(75.38% 0.0081 -0.1211) |
| OKLCH | oklch(75.38% 0.121 273.8) |
| XYZ | xyz(44.5159, 41.9814, 97.8342) |
| Luminance | 0.4198 (WCAG relative) |
| Temperature | cool |
| Family | blue |
Closest named colors
Periwinkle Blue
#8F99FB
ΔE00 4.43
Pastel Blue
#A2BFFE
ΔE00 5.76
Carolina Blue
#8AB8FE
ΔE00 6.77
Perrywinkle
#8F8CE7
ΔE00 8.67
Light Grey Blue
#9DBCD4
ΔE00 9.25
Cornflowerblue
#6495ED
ΔE00 9.31
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#97A9FC #FCEA97
analogous
#97DCFC #97A9FC #B897FC
triadic
#97A9FC #FC97A9 #A9FC97
tetradic
#97A9FC #FC97DC #FCEA97 #97FCB8
square
#97A9FC #FC97DC #FCEA97 #97FCB8
split-complementary
#97A9FC #FCB897 #DCFC97
monochromatic
#2047F9 #5C78FA #97A9FC #D2DAFE #E1E6FE
Accessibility & contrast
On white
2.23
#97A9FC on #FFFFFF
AA ✗AA large ✗AAA ✗
On black
9.40
#97A9FC on #000000
AA ✓AA large ✓AAA ✓
Best text color
#000000 on #97A9FC
9.40:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##97A9FC | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##97A9FC | 1.00 | 2.23 | 9.40 | 9.40 |
| #FFFFFF | 2.23 | 1.00 | 21.00 | 21.00 |
| #000000 | 9.40 | 21.00 | 1.00 | 1.00 |
| ##000000 | 9.40 | 21.00 | 1.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#8DB2FF
Deuteranopia (green-blind)
#85AAFA
Tritanopia (blue-blind)
#77BAC7
Achromatopsia (no color)
#ADADAD
Design tokens & code
CSS
--color: #97a9fc; /* rgb */ color: rgb(151, 169, 252); /* oklch */ color: oklch(75.4% 0.121 273.8);
Tailwind
colors: {
custom: {
50: '#b9c2fd',
500: '#97a9fc',
950: '#000000',
},
}SCSS
$custom: #97a9fc; $custom-light: #b9c2fd; $custom-dark: #000000;
JSON
{
"hex": "#97a9fc",
"rgb": {
"r": 151,
"g": 169,
"b": 252
},
"hsl": {
"h": 229.307,
"s": 94.393,
"l": 79.02
},
"oklch": {
"l": 0.75382,
"c": 0.12138,
"h": 273.8
},
"luminance": 0.41984
}Semantic roles & 50–950 ramp
primary
#97A9FC
secondary
#F6F0D5
accent
#BD00E6
background
#FBFBFF
surface
#F6F7FF
border
#D0D0D7
text
#121217
muted
#818185