最接近的命名颜色 · #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);
}