#7480F3#7480F3
#7480F3 is a light, vivid blue. Relative luminance 0.256; OKLCH L 64.5% C 0.170 H 276.1°. Best body text is #000000 at 6.12:1 contrast (WCAG AA passes).
Color values
| HEX | #7480F3 |
|---|---|
| RGB | rgb(116, 128, 243) |
| HSL | hsl(234, 84%, 70%) |
| HSV | hsv(234, 52%, 95%) |
| CMYK | cmyk(52.3%, 47.3%, 0%, 4.7%) |
| CIE-LAB | lab(57.67, 26.96, -59.33) |
| CIE-LCH | lch(57.67, 65.17, 294.44°) |
| OKLab | oklab(64.55% 0.018 -0.169) |
| OKLCH | oklch(64.55% 0.17 276.1) |
| XYZ | xyz(31.0942, 25.6204, 88.0834) |
| Luminance | 0.2562 (WCAG relative) |
| Temperature | cool |
| Family | blue |
Closest named colors
Cornflower
#6A79F7
ΔE00 2.43
Lavender Blue
#8B88F8
ΔE00 4.35
Soft Blue
#6488EA
ΔE00 4.88
Periwinkle (survey)
#8E82FE
ΔE00 4.89
Perrywinkle
#8F8CE7
ΔE00 6.14
Lightish Blue
#3D7AFD
ΔE00 6.95
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#7480F3 #F3E774
analogous
#74BFF3 #7480F3 #A874F3
triadic
#7480F3 #F37480 #80F374
tetradic
#7480F3 #F374BF #F3E774 #74F3A8
square
#7480F3 #F374BF #F3E774 #74F3A8
split-complementary
#7480F3 #F3A874 #BFF374
monochromatic
#1326DA #3C4DEE #7480F3 #ACB3F8 #E3E5FD
Accessibility & contrast
On white
3.43
#7480F3 on #FFFFFF
AA ✗AA large ✓AAA ✗
On black
6.12
#7480F3 on #000000
AA ✓AA large ✓AAA ✗
Best text color
#000000 on #7480F3
6.12:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##7480F3 | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##7480F3 | 1.00 | 3.43 | 6.12 | 6.12 |
| #FFFFFF | 3.43 | 1.00 | 21.00 | 21.00 |
| #000000 | 6.12 | 21.00 | 1.00 | 1.00 |
| ##000000 | 6.12 | 21.00 | 1.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#4B90F7
Deuteranopia (green-blind)
#3C86F1
Tritanopia (blue-blind)
#3A99AE
Achromatopsia (no color)
#8B8B8B
Design tokens & code
CSS
--color: #7480f3; /* rgb */ color: rgb(116, 128, 243); /* oklch */ color: oklch(64.5% 0.170 276.1);
Tailwind
colors: {
custom: {
50: '#a4a4f8',
500: '#7480f3',
950: '#000000',
},
}SCSS
$custom: #7480f3; $custom-light: #a4a4f8; $custom-dark: #000000;
JSON
{
"hex": "#7480f3",
"rgb": {
"r": 116,
"g": 128,
"b": 243
},
"hsl": {
"h": 234.331,
"s": 84.106,
"l": 70.392
},
"oklch": {
"l": 0.64547,
"c": 0.16998,
"h": 276.1
},
"luminance": 0.25622
}Semantic roles & 50–950 ramp
primary
#7480F3
secondary
#F3F0D0
accent
#CC05E1
background
#FAFAFF
surface
#F4F4FF
border
#CECED7
text
#100F17
muted
#7F7F85