命名颜色 · #DDDCBF
Woven Reed
Woven Reed 即 #DDDCBF：rgb(221 220 191)、hsl(58 31% 81%)、oklch(0.888 0.039 105.5)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。
What does Yellow mean? → · Woven Reed color name →
#DDDCBF
oklch(0.888 0.039 105.5)
颜色转换
- HEX
- #dddcbf
- RGB
- rgb(221 220 191)
- HSL
- hsl(58 31% 81%)
- HWB
- hwb(58 75% 13%)
- OKLCH
- oklch(0.888 0.039 105.5)
- OKLab
- oklab(0.888 -0.01 0.037)
- CIE Lab
- lab(87.27 -3.26 14.45)
- LCH
- lch(87.27 14.81 102.7)
- CMYK
- cmyk(0% 0% 14% 13%)
浅色调 · 深色调 · 灰色调
浅色调
- E0DFC5
- E4E3CC
- E7E6D2
- EAEAD8
- EEEDDF
- F1F1E5
- F5F4EC
- F8F8F2
- FCFBF9
深色调
- C0BFA6
- A4A38D
- 888875
- 6E6E5E
- 555448
- 3D3C33
- 26261F
- 11110D
- 020202
灰色调
- D3D2B9
- CAC9B2
- C0C0AC
- B7B6A5
- ADAD9F
- A4A499
- 9B9B93
- 92928C
- 898986
配色和谐
互补色 +180°
- DDDCBF
Woven Reed
- D7D7F3
≈ Lavender Sky
类似色 -30° +30°
- DDDCBF
Woven Reed
- E9D7BE
≈ Writer’s Parchment
- CFE0C7
≈ Endive
三角配色 +120° +240°
- DDDCBF
Woven Reed
- C0E0EE
≈ Cotton Clouds
- EED0E0
≈ Lacquer Mauve
分裂互补色 +150° +210°
- DDDCBF
Woven Reed
- CADCF4
≈ Fly a Kite
- E4D3EC
≈ First Lilac
四角配色 +90° +180° +270°
对比度与无障碍
Ag
Fail白底
WCAG 1.39:1 · APCA Lc 19
Ag
AAA黑底
WCAG 15.06:1 · APCA Lc 84
最佳文字颜色: #000000
WCAG 15.06:1 (AAA) · APCA Lc 84
Contrast pairs
代码片段
CSS
:root {
--woven-reed: #dddcbf;
--woven-reed-rgb: 221 220 191;
--woven-reed-oklch: oklch(0.888 0.039 105.5);
}
.element {
color: var(--woven-reed);
background-color: hsl(58 31% 81%);
border-color: oklch(0.888 0.039 105.5);
}Tailwind CSS v4
@theme {
--color-woven-reed: #dddcbf;
--color-woven-reed-50: #f6f6ea;
--color-woven-reed-100: #e9e9db;
--color-woven-reed-200: #d5d6c3;
--color-woven-reed-300: #b9b9a3;
--color-woven-reed-400: #a1a086;
--color-woven-reed-500: #89886b;
--color-woven-reed-600: #74735a;
--color-woven-reed-700: #5d5c48;
--color-woven-reed-800: #444334;
--color-woven-reed-900: #2f2e23;
--color-woven-reed-950: #1c1b12;
}SCSS
$woven-reed: #dddcbf;
$woven-reed-rgb: 221, 220, 191;
$woven-reed-light: mix(#fff, $woven-reed, 20%);
$woven-reed-dark: mix(#000, $woven-reed, 20%);
.element {
color: $woven-reed;
box-shadow: 0 0 0 2px rgba($woven-reed, 0.35);
}