#77F6FD#77F6FD
#77F6FD is a very light, moderate teal. Relative luminance 0.769; OKLCH L 90.4% C 0.113 H 200.2°. Best body text is #000000 at 16.38:1 contrast (WCAG AA passes).
Color values
| HEX | #77F6FD |
|---|---|
| RGB | rgb(119, 246, 253) |
| HSL | hsl(183, 97%, 73%) |
| HSV | hsv(183, 53%, 99%) |
| CMYK | cmyk(53%, 2.8%, 0%, 0.8%) |
| CIE-LAB | lab(90.28, -33.33, -14.15) |
| CIE-LCH | lch(90.28, 36.21, 203.00°) |
| OKLab | oklab(90.36% -0.1062 -0.0391) |
| OKLCH | oklch(90.36% 0.113 200.2) |
| XYZ | xyz(58.2858, 76.9198, 104.6849) |
| Luminance | 0.7692 (WCAG relative) |
| Temperature | cool |
| Family | teal |
Closest named colors
Robin Egg Blue
#8AF1FE
ΔE00 3.48
Robin'S Egg
#6DEDFD
ΔE00 3.53
Bright Light Blue
#26F7FD
ΔE00 3.98
Bright Cyan
#41FDFE
ΔE00 4.35
Robin'S Egg Blue
#98EFF9
ΔE00 4.43
Aqua
#00FFFF
ΔE00 5.61
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#77F6FD #FD7E77
analogous
#77FDC1 #77F6FD #77B3FD
triadic
#77F6FD #FD77F6 #F6FD77
tetradic
#77F6FD #C177FD #FD7E77 #B3FD77
square
#77F6FD #C177FD #FD7E77 #B3FD77
split-complementary
#77F6FD #FD77B3 #FDC177
monochromatic
#04E9F6 #3BF2FC #77F6FD #B3FAFE #E1FDFF
Accessibility & contrast
On white
1.28
#77F6FD on #FFFFFF
AA ✗AA large ✗AAA ✗
On black
16.38
#77F6FD on #000000
AA ✓AA large ✓AAA ✓
Best text color
#000000 on #77F6FD
16.38:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##77F6FD | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##77F6FD | 1.00 | 1.28 | 16.38 | 16.38 |
| #FFFFFF | 1.28 | 1.00 | 21.00 | 21.00 |
| #000000 | 16.38 | 21.00 | 1.00 | 1.00 |
| ##000000 | 16.38 | 21.00 | 1.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#E7EDFE
Deuteranopia (green-blind)
#D1DCFE
Tritanopia (blue-blind)
#00FEF8
Achromatopsia (no color)
#E3E3E3
Design tokens & code
CSS
--color: #77f6fd; /* rgb */ color: rgb(119, 246, 253); /* oklch */ color: oklch(90.4% 0.113 200.2);
Tailwind
colors: {
custom: {
50: '#a9f9fe',
500: '#77f6fd',
950: '#000000',
},
}SCSS
$custom: #77f6fd; $custom-light: #a9f9fe; $custom-dark: #000000;
JSON
{
"hex": "#77f6fd",
"rgb": {
"r": 119,
"g": 246,
"b": 253
},
"hsl": {
"h": 183.134,
"s": 97.101,
"l": 72.941
},
"oklch": {
"l": 0.90361,
"c": 0.11316,
"h": 200.2
},
"luminance": 0.76925
}Semantic roles & 50–950 ramp
primary
#77F6FD
secondary
#DA463E
accent
#0C00E6
background
#FDFFFF
surface
#F8FFFF
border
#D1D7D7
text
#111717
muted
#818585