命名颜色 · #E1CDA4
Organic Bamboo
Organic Bamboo 即 #E1CDA4:rgb(225 205 164)、hsl(40 50% 76%)、oklch(0.855 0.059 85)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度,以及 CSS、Tailwind v4 和 SCSS 代码。
What does Orange mean? → · Organic Bamboo color name →
#E1CDA4
oklch(0.855 0.059 85)
颜色转换
- HEX
- #e1cda4
- RGB
- rgb(225 205 164)
- HSL
- hsl(40 50% 76%)
- HWB
- hwb(40 64% 12%)
- OKLCH
- oklch(0.855 0.059 85)
- OKLab
- oklab(0.855 0.005 0.058)
- CIE Lab
- lab(83.32 2.65 23.17)
- LCH
- lch(83.32 23.32 83.5)
- CMYK
- cmyk(0% 9% 27% 12%)
浅色调 · 深色调 · 灰色调
浅色调
- E4D2AD
- E7D7B6
- EADCBF
- EDE1C8
- F0E6D1
- F3EBDB
- F6F0E4
- F9F5ED
- FCFAF6
深色调
- C4B28E
- A79879
- 8B7E64
- 706650
- 564E3D
- 3E382B
- 27231A
- 120F0A
- 020201
灰色调
- D7C5A1
- CDBD9D
- C3B59A
- B9AE96
- AFA692
- A69E8F
- 9C978B
- 938F88
- 898784
配色和谐
互补色 +180°
- E1CDA4
Organic Bamboo
- BDCFF7
≈ Frost Fairy
类似色 -30° +30°
- E1CDA4
Organic Bamboo
- EEC6AB
≈ Citrus Sachet
- CDD4A9
≈ Trailing Vine
三角配色 +120° +240°
- E1CDA4
Organic Bamboo
- A2DBE2
≈ Ice Pack
- E4C3E5
≈ Prom Corsage
分裂互补色 +150° +210°
- E1CDA4
Organic Bamboo
- ABD6F1
≈ Light Shimmer
- D1C8F2
≈ Soap
四角配色 +90° +180° +270°
- E1CDA4
Organic Bamboo
- A8DCCD
≈ Prism
- BDCFF7
≈ Frost Fairy
- F0C0D1
≈ Guava Glow
对比度与无障碍
Ag
Fail白底
WCAG 1.55:1 · APCA Lc 26
Ag
AAA黑底
WCAG 13.47:1 · APCA Lc 77
最佳文字颜色: #000000
WCAG 13.47:1 (AAA) · APCA Lc 77
Contrast pairs
代码片段
CSS
:root {
--organic-bamboo: #e1cda4;
--organic-bamboo-rgb: 225 205 164;
--organic-bamboo-oklch: oklch(0.855 0.059 85);
}
.element {
color: var(--organic-bamboo);
background-color: hsl(40 50% 76%);
border-color: oklch(0.855 0.059 85);
}Tailwind CSS v4
@theme {
--color-organic-bamboo: #e1cda4;
--color-organic-bamboo-50: #fcf4e3;
--color-organic-bamboo-100: #f0e7d2;
--color-organic-bamboo-200: #dfd3b8;
--color-organic-bamboo-300: #c4b696;
--color-organic-bamboo-400: #ae9c77;
--color-organic-bamboo-500: #988359;
--color-organic-bamboo-600: #816f4b;
--color-organic-bamboo-700: #67593c;
--color-organic-bamboo-800: #4c412b;
--color-organic-bamboo-900: #352d1d;
--color-organic-bamboo-950: #201a0d;
}SCSS
$organic-bamboo: #e1cda4;
$organic-bamboo-rgb: 225, 205, 164;
$organic-bamboo-light: mix(#fff, $organic-bamboo, 20%);
$organic-bamboo-dark: mix(#000, $organic-bamboo, 20%);
.element {
color: $organic-bamboo;
box-shadow: 0 0 0 2px rgba($organic-bamboo, 0.35);
}