命名颜色 · #ADC484
Gnome Green
Gnome Green 即 #ADC484：rgb(173 196 132)、hsl(82 35% 64%)、oklch(0.787 0.09 124.5)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。
What does Yellow mean? → · Gnome Green color name →
#ADC484
oklch(0.787 0.09 124.5)
颜色转换
- HEX
- #adc484
- RGB
- rgb(173 196 132)
- HSL
- hsl(82 35% 64%)
- HWB
- hwb(82 52% 23%)
- OKLCH
- oklch(0.787 0.09 124.5)
- OKLab
- oklab(0.787 -0.051 0.074)
- CIE Lab
- lab(76.23 -16.21 29.49)
- LCH
- lch(76.23 33.65 118.8)
- CMYK
- cmyk(12% 0% 33% 23%)
浅色调 · 深色调 · 灰色调
浅色调
- B5CA90
- BDD09D
- C5D6A9
- CDDCB5
- D5E2C2
- DDE7CE
- E6EDDA
- EEF3E6
- F7F9F3
深色调
- 96AA72
- 7F9160
- 6A784F
- 55613F
- 414A2F
- 2D3520
- 1B2112
- 0B0E06
- 010201
灰色调
- A8BD84
- A4B684
- 9FAF84
- 9BA884
- 96A283
- 929B83
- 8D9482
- 898D82
- 848781
配色和谐
互补色 +180°
- ADC484
Gnome Green
- C6ACE9
≈ Purple Sand
类似色 -30° +30°
- ADC484
Gnome Green
- CCB976
≈ Green Citrine
- 8BCBA0
≈ Frost Gum
三角配色 +120° +240°
- ADC484
Gnome Green
- 88C0F0
≈ Wasurenagusa Blue
- EBA2B2
≈ Pinque
分裂互补色 +150° +210°
- ADC484
Gnome Green
- A8B6F4
≈ Wondrous Wisteria
- DEA4D1
≈ Chateau Rose
四角配色 +90° +180° +270°
- ADC484
Gnome Green
- 70C9DD
≈ Betsy
- C6ACE9
≈ Purple Sand
- EDA593
≈ Peach Tile
对比度与无障碍
Ag
Fail白底
WCAG 1.90:1 · APCA Lc 36
Ag
AAA黑底
WCAG 11.00:1 · APCA Lc 66
最佳文字颜色: #000000
WCAG 11.00:1 (AAA) · APCA Lc 66
Contrast pairs
代码片段
CSS
:root {
--gnome-green: #adc484;
--gnome-green-rgb: 173 196 132;
--gnome-green-oklch: oklch(0.787 0.09 124.5);
}
.element {
color: var(--gnome-green);
background-color: hsl(82 35% 64%);
border-color: oklch(0.787 0.09 124.5);
}Tailwind CSS v4
@theme {
--color-gnome-green: #adc484;
--color-gnome-green-50: #eefadf;
--color-gnome-green-100: #e0eece;
--color-gnome-green-200: #cadcb3;
--color-gnome-green-300: #abc08f;
--color-gnome-green-400: #93a86c;
--color-gnome-green-500: #79904b;
--color-gnome-green-600: #677a41;
--color-gnome-green-700: #526233;
--color-gnome-green-800: #3d4723;
--color-gnome-green-900: #2a3117;
--color-gnome-green-950: #171d08;
}SCSS
$gnome-green: #adc484;
$gnome-green-rgb: 173, 196, 132;
$gnome-green-light: mix(#fff, $gnome-green, 20%);
$gnome-green-dark: mix(#000, $gnome-green, 20%);
.element {
color: $gnome-green;
box-shadow: 0 0 0 2px rgba($gnome-green, 0.35);
}