#687EB4#687EB4
#687EB4 لون متوسط ومتوسط التشبّع من عائلة أزرق. الإضاءة النسبية 0.212؛ OKLCH L 59.8% C 0.087 H 266.8°. أفضل لون لنص المتن هو #000000 بتباين 5.23:1 (مطابق لمعيار WCAG AA).
قيم اللون
| HEX | #687EB4 |
|---|---|
| RGB | rgb(104, 126, 180) |
| HSL | hsl(223, 34%, 56%) |
| HSV | hsv(223, 42%, 71%) |
| CMYK | cmyk(42.2%, 30%, 0%, 29.4%) |
| CIE-LAB | lab(53.12, 6.26, -31.03) |
| CIE-LCH | lch(53.12, 31.66, 281.41°) |
| OKLab | oklab(59.8% -0.0048 -0.0867) |
| OKLCH | oklch(59.8% 0.087 266.8) |
| XYZ | xyz(21.4054, 21.1589, 46.1274) |
| Luminance | 0.2116 (WCAG relative) |
| Temperature | cool |
| Family | blue |
أقرب الألوان المُسمّاة
Faded Blue
#658CBB
ΔE00 6.09
Off Blue
#5684AE
ΔE00 6.75
Dusty Blue
#5A86AD
ΔE00 6.91
Cornflower Blue
#5170D7
ΔE00 7.12
Slate Blue (survey)
#5B7C99
ΔE00 7.25
Steel Blue (survey)
#5A7D9A
ΔE00 7.56
المقاييس الإدراكية
الدرجات الغامقة
الدرجات الفاتحة
التدريجات
OKLCH scale
تناغمات الألوان
complementary
#687EB4 #B49E68
analogous
#68A4B4 #687EB4 #7868B4
triadic
#687EB4 #B4687E #7EB468
tetradic
#687EB4 #B468A4 #B49E68 #68B478
square
#687EB4 #B468A4 #B49E68 #68B478
split-complementary
#687EB4 #B47868 #A4B468
monochromatic
#36456C #4A6095 #687EB4 #91A1C8 #BAC4DD
إمكانية الوصول والتباين
On white
4.01
#687EB4 on #FFFFFF
AA ✗AA large ✓AAA ✗
On black
5.23
#687EB4 on #000000
AA ✓AA large ✓AAA ✗
أفضل لون للنص
#000000 on #687EB4
5.23:1 — WCAG AA (نص عادي) مطابق
مصفوفة التباين
| fg \ bg | ##687EB4 | #FFFFFF | #000000 | ##000000 |
|---|---|---|---|---|
| ##687EB4 | 1.00 | 4.01 | 5.23 | 5.23 |
| #FFFFFF | 4.01 | 1.00 | 21.00 | 21.00 |
| #000000 | 5.23 | 21.00 | 1.00 | 1.00 |
| ##000000 | 5.23 | 21.00 | 1.00 | 1.00 |
معاينة عمى الألوان
Protanopia (red-blind)
#6B83B6
Deuteranopia (green-blind)
#647CB3
Tritanopia (blue-blind)
#4E8991
Achromatopsia (no color)
#7F7F7F
وسوم التصميم والكود
CSS
--color: #687eb4; /* rgb */ color: rgb(104, 126, 180); /* oklch */ color: oklch(59.8% 0.087 266.8);
Tailwind
colors: {
custom: {
50: '#96a3ca',
500: '#687eb4',
950: '#000000',
},
}SCSS
$custom: #687eb4; $custom-light: #96a3ca; $custom-dark: #000000;
JSON
{
"hex": "#687eb4",
"rgb": {
"r": 104,
"g": 126,
"b": 180
},
"hsl": {
"h": 222.632,
"s": 33.628,
"l": 55.686
},
"oklch": {
"l": 0.59797,
"c": 0.08686,
"h": 266.8
},
"luminance": 0.2116
}Semantic roles & 50–950 ramp
primary
#687EB4
secondary
#CCC3AC
accent
#AB5ECA
background
#F9FAFC
surface
#F2F3F8
border
#CCCDD1
text
#0E0F13
muted
#7E7F82