أقرب لون مسمّى · #0B4757
#0B4757
أقرب لون مسمّى: Nocturnal Expedition
#0B4757 (rgb(11 71 87)، hsl(193 78% 19%)، oklch(0.37 0.063 220.9)) أقرب إلى اللون المسمّى Nocturnal Expedition. شاهد الدرجات الفاتحة والداكنة والتناسقات وتباين WCAG وAPCA وأكواد CSS وTailwind v4 وSCSS.
#0B4757
oklch(0.37 0.063 220.9)
تحويلات الألوان
- HEX
- #0b4757
- RGB
- rgb(11 71 87)
- HSL
- hsl(193 78% 19%)
- HWB
- hwb(193 4% 66%)
- OKLCH
- oklch(0.37 0.063 220.9)
- OKLab
- oklab(0.37 -0.048 -0.041)
- CIE Lab
- lab(27.21 -14.1 -15.11)
- LCH
- lch(27.21 20.67 227)
- CMYK
- cmyk(87% 18% 0% 66%)
درجات فاتحة · درجات داكنة · درجات رمادية
درجات فاتحة
- 295867
- 406976
- 577A86
- 6E8C97
- 859FA8
- 9DB1B9
- B5C4CA
- CDD8DB
- E6EBED
درجات داكنة
- 083D4B
- 06323E
- 042833
- 021F27
- 01161C
- 010D12
- 000608
- 000203
- 000000
درجات رمادية
- 1D4D5B
- 2A525F
- 365863
- 415E68
- 4B636C
- 566970
- 616F74
- 6B7578
- 767A7C
تناسق الألوان
متمم +180°
- 0B4757
Nocturnal Expedition
- 5C3425
≈ Chubby Chocolate
متجاور -30° +30°
- 0B4757
Nocturnal Expedition
- 024A48
≈ Deep Into the Jungle
- 254260
≈ Blue Accolade
ثلاثي +120° +240°
- 0B4757
Nocturnal Expedition
- 56324A
≈ Italian Plum
- 474014
≈ Xanthophobia
متمم منقسم +150° +210°
- 0B4757
Nocturnal Expedition
- 5C3137
≈ Chocolate Truffle
- 553A16
≈ Pineapple
رباعي +90° +180° +270°
- 0B4757
Nocturnal Expedition
- 4A3658
≈ Purple Plumeria
- 5C3425
≈ Chubby Chocolate
- 344622
≈ Ceylanite
التباين وإمكانية الوصول
Ag
AAAعلى الأبيض
WCAG 10.22:1 · APCA Lc 93
Ag
Failعلى الأسود
WCAG 2.05:1 · APCA Lc 9
أفضل لون للنص: #FFFFFF
WCAG 10.22:1 (AAA) · APCA Lc 93
Contrast pairs
مقتطفات الأكواد
CSS
:root {
--nocturnal-expedition: #0b4757;
--nocturnal-expedition-rgb: 11 71 87;
--nocturnal-expedition-oklch: oklch(0.37 0.063 220.9);
}
.element {
color: var(--nocturnal-expedition);
background-color: hsl(193 78% 19%);
border-color: oklch(0.37 0.063 220.9);
}Tailwind CSS v4
@theme {
--color-nocturnal-expedition: #0b4757;
--color-nocturnal-expedition-50: #e3faff;
--color-nocturnal-expedition-100: #d2edf7;
--color-nocturnal-expedition-200: #b8dbe8;
--color-nocturnal-expedition-300: #95bfcf;
--color-nocturnal-expedition-400: #74a7b9;
--color-nocturnal-expedition-500: #5490a4;
--color-nocturnal-expedition-600: #487a8a;
--color-nocturnal-expedition-700: #39626f;
--color-nocturnal-expedition-800: #284851;
--color-nocturnal-expedition-900: #1b3239;
--color-nocturnal-expedition-950: #0b1e23;
}SCSS
$nocturnal-expedition: #0b4757;
$nocturnal-expedition-rgb: 11, 71, 87;
$nocturnal-expedition-light: mix(#fff, $nocturnal-expedition, 20%);
$nocturnal-expedition-dark: mix(#000, $nocturnal-expedition, 20%);
.element {
color: $nocturnal-expedition;
box-shadow: 0 0 0 2px rgba($nocturnal-expedition, 0.35);
}