#67698D#67698D
#67698D is a mid, muted blue. Relative luminance 0.149; OKLCH L 53.3% C 0.056 H 281.8°. Best body text is #FFFFFF at 5.27:1 contrast (WCAG AA passes).
Color values
| HEX | #67698D |
|---|---|
| RGB | rgb(103, 105, 141) |
| HSL | hsl(237, 16%, 48%) |
| HSV | hsv(237, 27%, 55%) |
| CMYK | cmyk(27%, 25.5%, 0%, 44.7%) |
| CIE-LAB | lab(45.51, 7.76, -20.00) |
| CIE-LCH | lch(45.51, 21.45, 291.20°) |
| OKLab | oklab(53.31% 0.0115 -0.0551) |
| OKLCH | oklch(53.31% 0.056 281.8) |
| XYZ | xyz(15.4516, 14.9095, 27.2579) |
| Luminance | 0.1491 (WCAG relative) |
| Temperature | cool |
| Family | blue |
Closest named colors
Dusk
#4E5481
ΔE00 8.25
Purplish Grey
#7A687F
ΔE00 8.86
Grey Purple
#826D8C
ΔE00 9.05
Dusky Blue
#475F94
ΔE00 9.12
Dark Lavender
#856798
ΔE00 9.78
Twilight
#4E518B
ΔE00 9.82
Perceptual scales
Shades
Tints
Tones
OKLCH scale
Color harmonies
complementary
#67698D #8D8B67
analogous
#677C8D #67698D #78678D
triadic
#67698D #8D6769 #698D67
tetradic
#67698D #8D677C #8D8B67 #678D78
square
#67698D #8D677C #8D8B67 #678D78
split-complementary
#67698D #8D7867 #7C8D67
monochromatic
#333446 #4D4F6A #67698D #898AA9 #ACADC2
Accessibility & contrast
On white
5.27
#67698D on #FFFFFF
AA ✓AA large ✓AAA ✗
On black
3.98
#67698D on #000000
AA ✗AA large ✓AAA ✗
Best text color
#FFFFFF on #67698D
5.27:1 — WCAG AA (normal text) passes
Contrast matrix
| fg \ bg | ##67698D | #FFFFFF | #000000 | ##FFFFFF |
|---|---|---|---|---|
| ##67698D | 1.00 | 5.27 | 3.98 | 5.27 |
| #FFFFFF | 5.27 | 1.00 | 21.00 | 1.00 |
| #000000 | 3.98 | 21.00 | 1.00 | 21.00 |
| ##FFFFFF | 5.27 | 1.00 | 21.00 | 1.00 |
Color blindness preview
Protanopia (red-blind)
#5F6D8F
Deuteranopia (green-blind)
#5D6B8C
Tritanopia (blue-blind)
#5E6F75
Achromatopsia (no color)
#6C6C6C
Design tokens & code
CSS
--color: #67698d; /* rgb */ color: rgb(103, 105, 141); /* oklch */ color: oklch(53.3% 0.056 281.8);
Tailwind
colors: {
custom: {
50: '#9393ae',
500: '#67698d',
950: '#000000',
},
}SCSS
$custom: #67698d; $custom-light: #9393ae; $custom-dark: #000000;
JSON
{
"hex": "#67698d",
"rgb": {
"r": 103,
"g": 105,
"b": 141
},
"hsl": {
"h": 236.842,
"s": 15.574,
"l": 47.843
},
"oklch": {
"l": 0.53313,
"c": 0.05632,
"h": 281.8
},
"luminance": 0.1491
}Semantic roles & 50–950 ramp
primary
#67698D
secondary
#B1B09E
accent
#B46FB8
background
#F9F9FA
surface
#F1F1F4
border
#CBCBCE
text
#0D0D10
muted
#7E7E7F