لون مسمّى · #7E8FBB
Opal Violet
Opal Violet هو #7E8FBB: rgb(126 143 187)، hsl(223 31% 61%)، oklch(0.653 0.069 268.1). شاهد الدرجات الفاتحة والداكنة والتناسقات وتباين WCAG وAPCA وأكواد CSS وTailwind v4 وSCSS.
What does Blue mean? → · Opal Violet color name →
#7E8FBB
oklch(0.653 0.069 268.1)
تحويلات الألوان
- HEX
- #7e8fbb
- RGB
- rgb(126 143 187)
- HSL
- hsl(223 31% 61%)
- HWB
- hwb(223 49% 27%)
- OKLCH
- oklch(0.653 0.069 268.1)
- OKLab
- oklab(0.653 -0.002 -0.069)
- CIE Lab
- lab(59.29 1.71 -25.23)
- LCH
- lch(59.29 25.29 273.9)
- CMYK
- cmyk(33% 24% 0% 27%)
درجات فاتحة · درجات داكنة · درجات رمادية
درجات فاتحة
- 8A9AC2
- 96A5C9
- A3B0D0
- B0BBD7
- BDC6DD
- CAD1E4
- D7DDEB
- E4E8F2
- F1F3F8
درجات داكنة
- 6D7CA2
- 5C698A
- 4C5773
- 3C455C
- 2D3446
- 1F2432
- 11151F
- 05070D
- 010102
درجات رمادية
- 7E8EB5
- 7E8CAF
- 7F8BA9
- 7F89A4
- 7F889E
- 7F8698
- 7F8592
- 80838C
- 808286
تناسق الألوان
متمم +180°
- 7E8FBB
Opal Violet
- A28E5F
≈ Camouflage Olive
متجاور -30° +30°
- 7E8FBB
Opal Violet
- 6797B6
≈ Aragonite Blue
- 9587B5
≈ Silk Lilac
ثلاثي +120° +240°
- 7E8FBB
Opal Violet
- B78079
≈ Ash Rose
- 739C79
≈ Holiday Camp
متمم منقسم +150° +210°
- 7E8FBB
Opal Violet
- B08666
≈ Syrup
- 8C9666
≈ Bullfrog
رباعي +90° +180° +270°
- 7E8FBB
Opal Violet
- B37F90
≈ Degas Pink
- A28E5F
≈ Camouflage Olive
- 5F9E90
≈ Dull Teal
التباين وإمكانية الوصول
Ag
Failعلى الأبيض
WCAG 3.21:1 · APCA Lc 59
Ag
AAعلى الأسود
WCAG 6.53:1 · APCA Lc 42
أفضل لون للنص: #000000
WCAG 6.53:1 (AA) · APCA Lc 42
Contrast pairs
مقتطفات الأكواد
CSS
:root {
--opal-violet: #7e8fbb;
--opal-violet-rgb: 126 143 187;
--opal-violet-oklch: oklch(0.653 0.069 268.1);
}
.element {
color: var(--opal-violet);
background-color: hsl(223 31% 61%);
border-color: oklch(0.653 0.069 268.1);
}Tailwind CSS v4
@theme {
--color-opal-violet: #7e8fbb;
--color-opal-violet-50: #edf5ff;
--color-opal-violet-100: #dfe7ff;
--color-opal-violet-200: #c9d4f3;
--color-opal-violet-300: #a9b6dc;
--color-opal-violet-400: #8d9dc8;
--color-opal-violet-500: #7385b5;
--color-opal-violet-600: #617098;
--color-opal-violet-700: #4d5a7a;
--color-opal-violet-800: #37425b;
--color-opal-violet-900: #262d3f;
--color-opal-violet-950: #141a28;
}SCSS
$opal-violet: #7e8fbb;
$opal-violet-rgb: 126, 143, 187;
$opal-violet-light: mix(#fff, $opal-violet, 20%);
$opal-violet-dark: mix(#000, $opal-violet, 20%);
.element {
color: $opal-violet;
box-shadow: 0 0 0 2px rgba($opal-violet, 0.35);
}