#60AEF2#60AEF2
#60AEF2 is a light, vivid cyan. Relative luminance 0.392; OKLCH L 72.9% C 0.126 H 246.9°. Best body text is #000000 at 8.83:1 contrast (WCAG AA passes).
Color values
| HEX | #60AEF2 |
|---|---|
| RGB | rgb(96, 174, 242) |
| HSL | hsl(208, 85%, 66%) |
| HSV | hsv(208, 60%, 95%) |
| CMYK | cmyk(60.3%, 28.1%, 0%, 5.1%) |
| CIE-LAB | lab(68.87, -4.13, -41.12) |
| CIE-LCH | lch(68.87, 41.33, 264.27°) |
| OKLab | oklab(72.92% -0.0495 -0.1158) |
| OKLCH | oklch(72.92% 0.126 246.9) |
| XYZ | xyz(35.9810, 39.1663, 89.6509) |
| Luminance | 0.3917 (WCAG relative) |
| Temperature | cool |
| Family | cyan |
Closest named colors
Sky Blue (survey)
#75BBFD
ΔE00 3.83
Carolina Blue
#8AB8FE
ΔE00 6.69
Azure (survey)
#069AF3
ΔE00 6.71
Sky
#82CAFC
ΔE00 7.91
Lightblue (survey)
#7BC8F6
ΔE00 8.07
Deepskyblue
#00BFFF
ΔE00 8.64
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#60AEF2 #F2A460
analogous
#60F2ED #60AEF2 #6065F2
triadic
#60AEF2 #F260AE #AEF260
tetradic
#60AEF2 #ED60F2 #F2A460 #65F260
square
#60AEF2 #ED60F2 #F2A460 #65F260
split-complementary
#60AEF2 #F26065 #F2ED60
monochromatic
#1072C7 #2791ED #60AEF2 #99CBF7 #D1E8FB
Accessibility & contrast
On white
2.38
#60AEF2 on #FFFFFF
AA ✗AA large ✗AAA ✗
On black
8.83
#60AEF2 on #000000
AA ✓AA large ✓AAA ✓
Best text color
#000000 on #60AEF2
8.83:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##60AEF2 | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##60AEF2 | 1.00 | 2.38 | 8.83 | 8.83 |
| #FFFFFF | 2.38 | 1.00 | 21.00 | 21.00 |
| #000000 | 8.83 | 21.00 | 1.00 | 1.00 |
| ##000000 | 8.83 | 21.00 | 1.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#91B0F5
Deuteranopia (green-blind)
#7DA2F1
Tritanopia (blue-blind)
#00BEC6
Achromatopsia (no color)
#A8A8A8
Design tokens & code
CSS
--color: #60aef2; /* rgb */ color: rgb(96, 174, 242); /* oklch */ color: oklch(72.9% 0.126 246.9);
Tailwind
colors: {
custom: {
50: '#99c5f6',
500: '#60aef2',
950: '#000000',
},
}SCSS
$custom: #60aef2; $custom-light: #99c5f6; $custom-dark: #000000;
JSON
{
"hex": "#60aef2",
"rgb": {
"r": 96,
"g": 174,
"b": 242
},
"hsl": {
"h": 207.945,
"s": 84.884,
"l": 66.275
},
"oklch": {
"l": 0.72923,
"c": 0.12591,
"h": 246.9
},
"luminance": 0.3917
}Semantic roles & 50–950 ramp
primary
#60AEF2
secondary
#EFD5BF
accent
#6B04E1
background
#FAFCFF
surface
#F3F8FE
border
#CDD1D6
text
#0F1217
muted
#7F8185