命名颜色 · #28A873
Garden Medley
Garden Medley 即 #28A873：rgb(40 168 115)、hsl(155 62% 41%)、oklch(0.651 0.135 160.3)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。
What does Green mean? → · Garden Medley color name →
#28A873
oklch(0.651 0.135 160.3)
颜色转换
- HEX
- #28a873
- RGB
- rgb(40 168 115)
- HSL
- hsl(155 62% 41%)
- HWB
- hwb(155 16% 34%)
- OKLCH
- oklch(0.651 0.135 160.3)
- OKLab
- oklab(0.651 -0.127 0.045)
- CIE Lab
- lab(61.29 -44.99 17.32)
- LCH
- lch(61.29 48.21 158.9)
- CMYK
- cmyk(76% 0% 32% 34%)
浅色调 · 深色调 · 灰色调
浅色调
- 49B180
- 62BA8E
- 78C29C
- 8CCBA9
- A0D4B7
- B3DDC5
- C6E5D4
- D9EEE2
- ECF6F0
深色调
- 219263
- 1B7C54
- 156745
- 0F5236
- 093F28
- 042C1B
- 021A0F
- 010A05
- 000101
灰色调
- 3AA475
- 47A076
- 529D77
- 5B9979
- 63957A
- 6A917B
- 708D7D
- 76887E
- 7B847F
配色和谐
互补色 +180°
- 28A873
Garden Medley
- C56CA9
≈ Sugar Creek
类似色 -30° +30°
- 28A873
Garden Medley
- 739F40
≈ Indubitably Green
- 00A59F
≈ Jadestone
三角配色 +120° +240°
- 28A873
Garden Medley
- 8184DF
≈ Indigo Bloom
- D3704C
≈ Coral Gold
分裂互补色 +150° +210°
- 28A873
Garden Medley
- A976CC
≈ Wisteria
- D3697C
≈ Pinkish
四角配色 +90° +180° +270°
- 28A873
Garden Medley
- 4894DE
≈ Flax Flower Blue
- C56CA9
≈ Sugar Creek
- C37F17
≈ Turmeric Brown
对比度与无障碍
Ag
Fail白底
WCAG 3.02:1 · APCA Lc 57
Ag
AA黑底
WCAG 6.93:1 · APCA Lc 45
最佳文字颜色: #000000
WCAG 6.93:1 (AA) · APCA Lc 45
Contrast pairs
代码片段
CSS
:root {
--garden-medley: #28a873;
--garden-medley-rgb: 40 168 115;
--garden-medley-oklch: oklch(0.651 0.135 160.3);
}
.element {
color: var(--garden-medley);
background-color: hsl(155 62% 41%);
border-color: oklch(0.651 0.135 160.3);
}Tailwind CSS v4
@theme {
--color-garden-medley: #28a873;
--color-garden-medley-50: #d4ffea;
--color-garden-medley-100: #c0f7db;
--color-garden-medley-200: #9fe7c3;
--color-garden-medley-300: #72cda3;
--color-garden-medley-400: #46b783;
--color-garden-medley-500: #00a067;
--color-garden-medley-600: #008857;
--color-garden-medley-700: #006d46;
--color-garden-medley-800: #025030;
--color-garden-medley-900: #033821;
--color-garden-medley-950: #002210;
}SCSS
$garden-medley: #28a873;
$garden-medley-rgb: 40, 168, 115;
$garden-medley-light: mix(#fff, $garden-medley, 20%);
$garden-medley-dark: mix(#000, $garden-medley, 20%);
.element {
color: $garden-medley;
box-shadow: 0 0 0 2px rgba($garden-medley, 0.35);
}