命名颜色 · #39373B
Avocado Peel
Avocado Peel 即 #39373B：rgb(57 55 59)、hsl(270 4% 22%)、oklch(0.34 0.007 308.2)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。
What does Gray mean? → · Avocado Peel color name →
#39373B
oklch(0.34 0.007 308.2)
颜色转换
- HEX
- #39373b
- RGB
- rgb(57 55 59)
- HSL
- hsl(270 4% 22%)
- HWB
- hwb(270 22% 77%)
- OKLCH
- oklch(0.34 0.007 308.2)
- OKLab
- oklab(0.34 0.005 -0.006)
- CIE Lab
- lab(23.39 1.59 -2.18)
- LCH
- lch(23.39 2.7 306)
- CMYK
- cmyk(3% 7% 0% 77%)
浅色调 · 深色调 · 灰色调
浅色调
- 4A484C
- 5C5B5E
- 6F6D70
- 828183
- 969597
- AAA9AB
- BFBEBF
- D4D3D4
- E9E9E9
深色调
- 302E32
- 282629
- 1F1E21
- 171619
- 100F11
- 090809
- 040304
- 010101
- 000000
灰色调
- 403E41
- 464548
- 4D4C4F
- 545356
- 5B5A5C
- 626263
- 6A696A
- 717172
- 787879
配色和谐
互补色 +180°
- 39373B
Avocado Peel
- 373935
≈ Pirate Black
类似色 -30° +30°
- 39373B
Avocado Peel
- 37383C
≈ Vulcan
- 3B3739
≈ Avocado Peel
三角配色 +120° +240°
- 39373B
Avocado Peel
- 3B3734
≈ Fired Earth
- 343939
≈ Tàn Hēi Soot
分裂互补色 +150° +210°
- 39373B
Avocado Peel
- 393834
≈ Lacquered Liquorice
- 353937
≈ Charcoal
四角配色 +90° +180° +270°
- 39373B
Avocado Peel
- 3C3735
≈ Fired Earth
- 373935
≈ Pirate Black
- 34393B
≈ Onyx Heart
对比度与无障碍
Ag
AAA白底
WCAG 11.77:1 · APCA Lc 97
Ag
Fail黑底
WCAG 1.78:1 · APCA Lc 0
最佳文字颜色: #FFFFFF
WCAG 11.77:1 (AAA) · APCA Lc 97
Contrast pairs
代码片段
CSS
:root {
--avocado-peel: #39373b;
--avocado-peel-rgb: 57 55 59;
--avocado-peel-oklch: oklch(0.34 0.007 308.2);
}
.element {
color: var(--avocado-peel);
background-color: hsl(270 4% 22%);
border-color: oklch(0.34 0.007 308.2);
}Tailwind CSS v4
@theme {
--color-avocado-peel: #39373b;
--color-avocado-peel-50: #f6f4f7;
--color-avocado-peel-100: #e8e7ea;
--color-avocado-peel-200: #d5d3d7;
--color-avocado-peel-300: #b8b6ba;
--color-avocado-peel-400: #9f9da2;
--color-avocado-peel-500: #87858a;
--color-avocado-peel-600: #737075;
--color-avocado-peel-700: #5c5a5d;
--color-avocado-peel-800: #434244;
--color-avocado-peel-900: #2e2d2f;
--color-avocado-peel-950: #1b1a1c;
}SCSS
$avocado-peel: #39373b;
$avocado-peel-rgb: 57, 55, 59;
$avocado-peel-light: mix(#fff, $avocado-peel, 20%);
$avocado-peel-dark: mix(#000, $avocado-peel, 20%);
.element {
color: $avocado-peel;
box-shadow: 0 0 0 2px rgba($avocado-peel, 0.35);
}