最接近的命名颜色 · #86A545
#86A545
最接近的命名颜色: Lime It or Leave It
#86A545(rgb(134 165 69)、hsl(79 41% 46%)、oklch(0.678 0.129 124.7))最接近命名颜色 Lime It or Leave It。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度,以及 CSS、Tailwind v4 和 SCSS 代码。
#86A545
oklch(0.678 0.129 124.7)
颜色转换
- HEX
- #86a545
- RGB
- rgb(134 165 69)
- HSL
- hsl(79 41% 46%)
- HWB
- hwb(79 27% 35%)
- OKLCH
- oklch(0.678 0.129 124.7)
- OKLab
- oklab(0.678 -0.073 0.106)
- CIE Lab
- lab(63.87 -22.32 44.93)
- LCH
- lch(63.87 50.17 116.4)
- CMYK
- cmyk(19% 0% 58% 35%)
浅色调 · 深色调 · 灰色调
浅色调
- 91AE5A
- 9DB76D
- A9C080
- B5C992
- C1D2A4
- CDDBB6
- D9E4C8
- E6EDDB
- F2F6ED
深色调
- 748F3B
- 627931
- 516527
- 40511E
- 303D15
- 212B0C
- 131A05
- 060A02
- 010100
灰色调
- 85A14E
- 859E55
- 849A5C
- 849762
- 839368
- 828F6D
- 828C72
- 818877
- 81847C
配色和谐
互补色 +180°
- 86A545
Lime It or Leave It
- AA82D7
≈ Lavender Blossom
类似色 -30° +30°
- 86A545
Lime It or Leave It
- B19623
≈ Faint Gold
- 4BAF74
≈ Link’s Awakening
三角配色 +120° +240°
- 86A545
Lime It or Leave It
- 499FE1
≈ Perfect Days
- D8738D
≈ Minuette
分裂互补色 +150° +210°
- 86A545
Lime It or Leave It
- 8190E6
≈ Perrywinkle
- C878B7
≈ Peruvian Lily
四角配色 +90° +180° +270°
- 86A545
Lime It or Leave It
- 00AAC5
≈ Sarah’s Garden
- AA82D7
≈ Lavender Blossom
- DB7860
≈ Rich Georgia Clay
对比度与无障碍
Ag
Fail白底
WCAG 2.80:1 · APCA Lc 54
Ag
AAA黑底
WCAG 7.48:1 · APCA Lc 48
最佳文字颜色: #000000
WCAG 7.48:1 (AAA) · APCA Lc 48
Contrast pairs
代码片段
CSS
:root {
--lime-it-or-leave-it: #86a545;
--lime-it-or-leave-it-rgb: 134 165 69;
--lime-it-or-leave-it-oklch: oklch(0.678 0.129 124.7);
}
.element {
color: var(--lime-it-or-leave-it);
background-color: hsl(79 41% 46%);
border-color: oklch(0.678 0.129 124.7);
}Tailwind CSS v4
@theme {
--color-lime-it-or-leave-it: #86a545;
--color-lime-it-or-leave-it-50: #ebfdd5;
--color-lime-it-or-leave-it-100: #dcf0c2;
--color-lime-it-or-leave-it-200: #c6dfa3;
--color-lime-it-or-leave-it-300: #a6c47b;
--color-lime-it-or-leave-it-400: #8dab52;
--color-lime-it-or-leave-it-500: #739422;
--color-lime-it-or-leave-it-600: #627d20;
--color-lime-it-or-leave-it-700: #4e6419;
--color-lime-it-or-leave-it-800: #3a490d;
--color-lime-it-or-leave-it-900: #283308;
--color-lime-it-or-leave-it-950: #161e00;
}SCSS
$lime-it-or-leave-it: #86a545;
$lime-it-or-leave-it-rgb: 134, 165, 69;
$lime-it-or-leave-it-light: mix(#fff, $lime-it-or-leave-it, 20%);
$lime-it-or-leave-it-dark: mix(#000, $lime-it-or-leave-it, 20%);
.element {
color: $lime-it-or-leave-it;
box-shadow: 0 0 0 2px rgba($lime-it-or-leave-it, 0.35);
}