#7AA0FC#7AA0FC
#7AA0FC is a light, vivid blue. Relative luminance 0.363; OKLCH L 71.7% C 0.141 H 266.0°. Best body text is #000000 at 8.26:1 contrast (WCAG AA passes).
Color values
| HEX | #7AA0FC |
|---|---|
| RGB | rgb(122, 160, 252) |
| HSL | hsl(222, 96%, 73%) |
| HSV | hsv(222, 52%, 99%) |
| CMYK | cmyk(51.6%, 36.5%, 0%, 1.2%) |
| CIE-LAB | lab(66.75, 12.17, -49.81) |
| CIE-LCH | lch(66.75, 51.28, 283.73°) |
| OKLab | oklab(71.75% -0.0099 -0.1408) |
| OKLCH | oklch(71.75% 0.141 266) |
| XYZ | xyz(38.1617, 36.3048, 97.0732) |
| Luminance | 0.3631 (WCAG relative) |
| Temperature | cool |
| Family | blue |
Closest named colors
Cornflowerblue
#6495ED
ΔE00 4.37
Periwinkle Blue
#8F99FB
ΔE00 5.72
Carolina Blue
#8AB8FE
ΔE00 6.47
Soft Blue
#6488EA
ΔE00 7.34
Pastel Blue
#A2BFFE
ΔE00 8.78
Dark Sky Blue
#448EE4
ΔE00 8.89
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#7AA0FC #FCD67A
analogous
#7AE1FC #7AA0FC #957AFC
triadic
#7AA0FC #FC7AA0 #A0FC7A
tetradic
#7AA0FC #FC7AE1 #FCD67A #7AFC95
square
#7AA0FC #FC7AE1 #FCD67A #7AFC95
split-complementary
#7AA0FC #FC957A #E1FC7A
monochromatic
#064CF6 #3E75FB #7AA0FC #B6CBFD #E1EAFE
Accessibility & contrast
On white
2.54
#7AA0FC on #FFFFFF
AA ✗AA large ✗AAA ✗
On black
8.26
#7AA0FC on #000000
AA ✓AA large ✓AAA ✓
Best text color
#000000 on #7AA0FC
8.26:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##7AA0FC | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##7AA0FC | 1.00 | 2.54 | 8.26 | 8.26 |
| #FFFFFF | 2.54 | 1.00 | 21.00 | 21.00 |
| #000000 | 8.26 | 21.00 | 1.00 | 1.00 |
| ##000000 | 8.26 | 21.00 | 1.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#7CA9FF
Deuteranopia (green-blind)
#6D9DFA
Tritanopia (blue-blind)
#3BB4C2
Achromatopsia (no color)
#A2A2A2
Design tokens & code
CSS
--color: #7aa0fc; /* rgb */ color: rgb(122, 160, 252); /* oklch */ color: oklch(71.7% 0.141 266.0);
Tailwind
colors: {
custom: {
50: '#a8bbfe',
500: '#7aa0fc',
950: '#000000',
},
}SCSS
$custom: #7aa0fc; $custom-light: #a8bbfe; $custom-dark: #000000;
JSON
{
"hex": "#7aa0fc",
"rgb": {
"r": 122,
"g": 160,
"b": 252
},
"hsl": {
"h": 222.462,
"s": 95.588,
"l": 73.333
},
"oklch": {
"l": 0.71749,
"c": 0.14113,
"h": 266
},
"luminance": 0.36307
}Semantic roles & 50–950 ramp
primary
#7AA0FC
secondary
#F7EDD4
accent
#A200E6
background
#FAFBFF
surface
#F4F6FF
border
#CED0D7
text
#101118
muted
#7F8086