命名颜色 · #BAD09D
Fava Bean
Fava Bean 即 #BAD09D：rgb(186 208 157)、hsl(86 35% 72%)、oklch(0.828 0.073 126.9)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。
What does Green mean? → · Fava Bean color name →
#BAD09D
oklch(0.828 0.073 126.9)
颜色转换
- HEX
- #bad09d
- RGB
- rgb(186 208 157)
- HSL
- hsl(86 35% 72%)
- HWB
- hwb(86 62% 18%)
- OKLCH
- oklch(0.828 0.073 126.9)
- OKLab
- oklab(0.828 -0.044 0.058)
- CIE Lab
- lab(80.84 -14.32 22.83)
- LCH
- lch(80.84 26.95 122.1)
- CMYK
- cmyk(11% 0% 25% 18%)
浅色调 · 深色调 · 灰色调
浅色调
- C1D5A7
- C7D9B1
- CEDEBA
- D5E3C4
- DCE8CE
- E3ECD8
- EAF1E1
- F1F6EB
- F8FAF5
深色调
- A1B588
- 899A73
- 72805F
- 5C674C
- 464F3A
- 323928
- 1E2318
- 0D1009
- 020201
灰色调
- B4C89A
- AEC098
- A8B795
- A2AF92
- 9DA78F
- 979F8C
- 919789
- 8B9086
- 868883
配色和谐
互补色 +180°
- BAD09D
Fava Bean
- D3BBEC
≈ Connecticut Lilac
类似色 -30° +30°
- BAD09D
Fava Bean
- D4C791
≈ Golden Mist
- A0D5B4
≈ Nihilakh Oxide
三角配色 +120° +240°
- BAD09D
Fava Bean
- A1CCF4
≈ Baby Blue Eyes
- F1B4BF
≈ Squid Pink
分裂互补色 +150° +210°
- BAD09D
Fava Bean
- BAC3F6
≈ Vodka
- E6B5D8
≈ Pink Gems
四角配色 +90° +180° +270°
- BAD09D
Fava Bean
- 8FD3E6
≈ July
- D3BBEC
≈ Connecticut Lilac
- F2B7A6
≈ Pink Mimosa
对比度与无障碍
Ag
Fail白底
WCAG 1.66:1 · APCA Lc 29
Ag
AAA黑底
WCAG 12.59:1 · APCA Lc 74
最佳文字颜色: #000000
WCAG 12.59:1 (AAA) · APCA Lc 74
Contrast pairs
代码片段
CSS
:root {
--fava-bean: #bad09d;
--fava-bean-rgb: 186 208 157;
--fava-bean-oklch: oklch(0.828 0.073 126.9);
}
.element {
color: var(--fava-bean);
background-color: hsl(86 35% 72%);
border-color: oklch(0.828 0.073 126.9);
}Tailwind CSS v4
@theme {
--color-fava-bean: #bad09d;
--color-fava-bean-50: #effae4;
--color-fava-bean-100: #e0edd4;
--color-fava-bean-200: #cbdbba;
--color-fava-bean-300: #acbf98;
--color-fava-bean-400: #93a778;
--color-fava-bean-500: #798f5a;
--color-fava-bean-600: #67794d;
--color-fava-bean-700: #52613d;
--color-fava-bean-800: #3d472b;
--color-fava-bean-900: #2a311d;
--color-fava-bean-950: #171d0d;
}SCSS
$fava-bean: #bad09d;
$fava-bean-rgb: 186, 208, 157;
$fava-bean-light: mix(#fff, $fava-bean, 20%);
$fava-bean-dark: mix(#000, $fava-bean, 20%);
.element {
color: $fava-bean;
box-shadow: 0 0 0 2px rgba($fava-bean, 0.35);
}