命名颜色 · #00576E
Submersible
Submersible 即 #00576E：rgb(0 87 110)、hsl(193 100% 22%)、oklch(0.424 0.079 223.6)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。
What does Cyan mean? → · Submersible color name →
#00576E
oklch(0.424 0.079 223.6)
颜色转换
- HEX
- #00576e
- RGB
- rgb(0 87 110)
- HSL
- hsl(193 100% 22%)
- HWB
- hwb(193 0% 57%)
- OKLCH
- oklch(0.424 0.079 223.6)
- OKLab
- oklab(0.424 -0.057 -0.055)
- CIE Lab
- lab(33.52 -16.39 -19.98)
- LCH
- lch(33.52 25.84 230.6)
- CMYK
- cmyk(100% 21% 0% 57%)
浅色调 · 深色调 · 灰色调
浅色调
- 28677C
- 42778A
- 5A8798
- 7197A6
- 88A8B5
- 9FB9C3
- B7CAD2
- CEDCE1
- E7EDF0
深色调
- 004B5F
- 003E50
- 003341
- 002733
- 001C26
- 001219
- 00080E
- 000304
- 000001
灰色调
- 1B5B70
- 2A6072
- 376474
- 436876
- 4E6C78
- 587079
- 62747B
- 6C787D
- 767C7E
配色和谐
互补色 +180°
- 00576E
Submersible
- 723F28
≈ Peruvian Soil
类似色 -30° +30°
- 00576E
Submersible
- 005A59
≈ Deep Sea Green
- 2D5079
≈ Slumber
三角配色 +120° +240°
- 00576E
Submersible
- 6C3B59
≈ Royal Lines
- 565013
≈ Scorzonera Brown
分裂互补色 +150° +210°
- 00576E
Submersible
- 733B41
≈ Queen’s Rose
- 684713
≈ Very Coffee
四角配色 +90° +180° +270°
- 00576E
Submersible
- 5E406D
≈ Grape Popsicle
- 723F28
≈ Peruvian Soil
- 3C5728
≈ Trefoil
对比度与无障碍
Ag
AAA白底
WCAG 8.11:1 · APCA Lc 88
Ag
Fail黑底
WCAG 2.58:1 · APCA Lc 15
最佳文字颜色: #FFFFFF
WCAG 8.11:1 (AAA) · APCA Lc 88
Contrast pairs
代码片段
CSS
:root {
--submersible: #00576e;
--submersible-rgb: 0 87 110;
--submersible-oklch: oklch(0.424 0.079 223.6);
}
.element {
color: var(--submersible);
background-color: hsl(193 100% 22%);
border-color: oklch(0.424 0.079 223.6);
}Tailwind CSS v4
@theme {
--color-submersible: #00576e;
--color-submersible-50: #defbff;
--color-submersible-100: #cdeefc;
--color-submersible-200: #b1dcee;
--color-submersible-300: #8bc0d7;
--color-submersible-400: #68a9c1;
--color-submersible-500: #4292ad;
--color-submersible-600: #397b92;
--color-submersible-700: #2e6375;
--color-submersible-800: #1f4956;
--color-submersible-900: #14323c;
--color-submersible-950: #051e26;
}SCSS
$submersible: #00576e;
$submersible-rgb: 0, 87, 110;
$submersible-light: mix(#fff, $submersible, 20%);
$submersible-dark: mix(#000, $submersible, 20%);
.element {
color: $submersible;
box-shadow: 0 0 0 2px rgba($submersible, 0.35);
}