最接近的命名颜色 · #2C4C1E
#2C4C1E
最接近的命名颜色: Treetop Cathedral
#2C4C1E（rgb(44 76 30)、hsl(102 43% 21%)、oklch(0.38 0.082 137.1)）最接近命名颜色 Treetop Cathedral。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。
#2C4C1E
oklch(0.38 0.082 137.1)
颜色转换
- HEX
- #2c4c1e
- RGB
- rgb(44 76 30)
- HSL
- hsl(102 43% 21%)
- HWB
- hwb(102 12% 70%)
- OKLCH
- oklch(0.38 0.082 137.1)
- OKLab
- oklab(0.38 -0.06 0.055)
- CIE Lab
- lab(28.95 -19.72 23.07)
- LCH
- lch(28.95 30.35 130.5)
- CMYK
- cmyk(42% 0% 61% 70%)
浅色调 · 深色调 · 灰色调
浅色调
- 3F5C33
- 526D48
- 667E5D
- 7B9073
- 90A289
- A5B4A0
- BBC6B7
- D1D9CE
- E8ECE6
深色调
- 254119
- 1E3613
- 172C0E
- 112209
- 0A1805
- 050F03
- 020601
- 010200
- 000000
灰色调
- 345128
- 3D5632
- 455C3C
- 4D6146
- 56664F
- 5E6B59
- 667063
- 6F766C
- 777B76
配色和谐
互补色 +180°
- 2C4C1E
Treetop Cathedral
- 54335F
≈ Royal Crown
类似色 -30° +30°
- 2C4C1E
Treetop Cathedral
- 474500
≈ Green Not Found
- 004F39
≈ Chrysocolla Dark Green
三角配色 +120° +240°
- 2C4C1E
Treetop Cathedral
- 24426D
≈ Nightlife
- 672E32
≈ Voluptuous
分裂互补色 +150° +210°
- 2C4C1E
Treetop Cathedral
- 403A6B
≈ American Blue
- 612F4B
≈ Grape Wine
四角配色 +90° +180° +270°
- 2C4C1E
Treetop Cathedral
- 004960
≈ Stegadon Scale Green
- 54335F
≈ Royal Crown
- 653318
≈ Meatloaf
对比度与无障碍
Ag
AAA白底
WCAG 9.72:1 · APCA Lc 92
Ag
Fail黑底
WCAG 2.15:1 · APCA Lc 10
最佳文字颜色: #FFFFFF
WCAG 9.72:1 (AAA) · APCA Lc 92
Contrast pairs
代码片段
CSS
:root {
--treetop-cathedral: #2c4c1e;
--treetop-cathedral-rgb: 44 76 30;
--treetop-cathedral-oklch: oklch(0.38 0.082 137.1);
}
.element {
color: var(--treetop-cathedral);
background-color: hsl(102 43% 21%);
border-color: oklch(0.38 0.082 137.1);
}Tailwind CSS v4
@theme {
--color-treetop-cathedral: #2c4c1e;
--color-treetop-cathedral-50: #eafbe5;
--color-treetop-cathedral-100: #dbefd5;
--color-treetop-cathedral-200: #c3ddbc;
--color-treetop-cathedral-300: #a2c29a;
--color-treetop-cathedral-400: #88aa7a;
--color-treetop-cathedral-500: #6c935d;
--color-treetop-cathedral-600: #5c7c4f;
--color-treetop-cathedral-700: #49633f;
--color-treetop-cathedral-800: #36492c;
--color-treetop-cathedral-900: #25321d;
--color-treetop-cathedral-950: #131e0d;
}SCSS
$treetop-cathedral: #2c4c1e;
$treetop-cathedral-rgb: 44, 76, 30;
$treetop-cathedral-light: mix(#fff, $treetop-cathedral, 20%);
$treetop-cathedral-dark: mix(#000, $treetop-cathedral, 20%);
.element {
color: $treetop-cathedral;
box-shadow: 0 0 0 2px rgba($treetop-cathedral, 0.35);
}