#6F97EB#6F97EB
#6F97EB is a light, vivid blue. Relative luminance 0.315; OKLCH L 68.4% C 0.132 H 263.9°. Best body text is #000000 at 7.30:1 contrast (WCAG AA passes).
Color values
| HEX | #6F97EB |
|---|---|
| RGB | rgb(111, 151, 235) |
| HSL | hsl(221, 76%, 68%) |
| HSV | hsv(221, 53%, 92%) |
| CMYK | cmyk(52.8%, 35.7%, 0%, 7.8%) |
| CIE-LAB | lab(62.93, 9.81, -46.56) |
| CIE-LCH | lch(62.93, 47.59, 281.89°) |
| OKLab | oklab(68.36% -0.014 -0.1316) |
| OKLCH | oklch(68.36% 0.132 263.9) |
| XYZ | xyz(32.6125, 31.5085, 82.9444) |
| Luminance | 0.3151 (WCAG relative) |
| Temperature | cool |
| Family | blue |
Closest named colors
Cornflowerblue
#6495ED
ΔE00 1.73
Soft Blue
#6488EA
ΔE00 4.56
Dark Sky Blue
#448EE4
ΔE00 6.30
Faded Blue
#658CBB
ΔE00 6.31
Periwinkle Blue
#8F99FB
ΔE00 6.62
Dodger Blue
#3E82FC
ΔE00 7.24
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#6F97EB #EBC36F
analogous
#6FD5EB #6F97EB #856FEB
triadic
#6F97EB #EB6F97 #97EB6F
tetradic
#6F97EB #EB6FD5 #EBC36F #6FEB85
square
#6F97EB #EB6FD5 #EBC36F #6FEB85
split-complementary
#6F97EB #EB856F #D5EB6F
monochromatic
#1B52C4 #3970E4 #6F97EB #A5BEF2 #DAE5FA
Accessibility & contrast
On white
2.88
#6F97EB on #FFFFFF
AA ✗AA large ✗AAA ✗
On black
7.30
#6F97EB on #000000
AA ✓AA large ✓AAA ✓
Best text color
#000000 on #6F97EB
7.30:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##6F97EB | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##6F97EB | 1.00 | 2.88 | 7.30 | 7.30 |
| #FFFFFF | 2.88 | 1.00 | 21.00 | 21.00 |
| #000000 | 7.30 | 21.00 | 1.00 | 1.00 |
| ##000000 | 7.30 | 21.00 | 1.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#769EEE
Deuteranopia (green-blind)
#6793E9
Tritanopia (blue-blind)
#2EA9B6
Achromatopsia (no color)
#989898
Design tokens & code
CSS
--color: #6f97eb; /* rgb */ color: rgb(111, 151, 235); /* oklch */ color: oklch(68.4% 0.132 263.9);
Tailwind
colors: {
custom: {
50: '#a0b5f2',
500: '#6f97eb',
950: '#000000',
},
}SCSS
$custom: #6f97eb; $custom-light: #a0b5f2; $custom-dark: #000000;
JSON
{
"hex": "#6f97eb",
"rgb": {
"r": 111,
"g": 151,
"b": 235
},
"hsl": {
"h": 220.645,
"s": 75.61,
"l": 67.843
},
"oklch": {
"l": 0.68364,
"c": 0.1323,
"h": 263.9
},
"luminance": 0.31511
}Semantic roles & 50–950 ramp
primary
#6F97EB
secondary
#EEE2C8
accent
#970ED8
background
#FAFBFE
surface
#F4F6FD
border
#CED0D5
text
#0F1117
muted
#7F8085