命名颜色 · #B29EAD
Symbolic
Symbolic 即 #B29EAD:rgb(178 158 173)、hsl(315 11% 66%)、oklch(0.721 0.031 334.6)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度,以及 CSS、Tailwind v4 和 SCSS 代码。
What does Gray mean? → · Symbolic color name →
#B29EAD
oklch(0.721 0.031 334.6)
颜色转换
- HEX
- #b29ead
- RGB
- rgb(178 158 173)
- HSL
- hsl(315 11% 66%)
- HWB
- hwb(315 62% 30%)
- OKLCH
- oklch(0.721 0.031 334.6)
- OKLab
- oklab(0.721 0.028 -0.013)
- CIE Lab
- lab(67.24 9.58 -4.99)
- LCH
- lch(67.24 10.8 332.5)
- CMYK
- cmyk(0% 11% 3% 30%)
浅色调 · 深色调 · 灰色调
浅色调
- BAA7B5
- C1B1BD
- C9BAC5
- D0C4CD
- D8CED5
- E0D7DE
- E8E1E6
- EFEBEE
- F7F5F7
深色调
- 9A8996
- 83747F
- 6D606A
- 574D55
- 433A41
- 2F292D
- 1D181B
- 0C090B
- 010101
灰色调
- AD9BA8
- A898A4
- A3959F
- 9E929B
- 998F96
- 948C92
- 8F898D
- 8A8689
- 858384
配色和谐
互补色 +180°
- B29EAD
Symbolic
- 96AB9C
≈ Scotland Road
类似色 -30° +30°
- B29EAD
Symbolic
- A9A0B5
≈ Grapeade
- B79DA2
≈ Windflower
三角配色 +120° +240°
- B29EAD
Symbolic
- ABA58F
≈ Lodgepole Pines
- 90AAB1
≈ Meditative
分裂互补色 +150° +210°
- B29EAD
Symbolic
- A0A994
≈ Bushel
- 90ACA7
≈ Oceanus
四角配色 +90° +180° +270°
对比度与无障碍
Ag
Fail白底
WCAG 2.50:1 · APCA Lc 49
Ag
AAA黑底
WCAG 8.38:1 · APCA Lc 53
最佳文字颜色: #000000
WCAG 8.38:1 (AAA) · APCA Lc 53
Contrast pairs
代码片段
CSS
:root {
--symbolic: #b29ead;
--symbolic-rgb: 178 158 173;
--symbolic-oklch: oklch(0.721 0.031 334.6);
}
.element {
color: var(--symbolic);
background-color: hsl(315 11% 66%);
border-color: oklch(0.721 0.031 334.6);
}Tailwind CSS v4
@theme {
--color-symbolic: #b29ead;
--color-symbolic-50: #fbf2f8;
--color-symbolic-100: #efe4ec;
--color-symbolic-200: #decfd9;
--color-symbolic-300: #c2b2bd;
--color-symbolic-400: #ab98a6;
--color-symbolic-500: #947f8f;
--color-symbolic-600: #7d6b79;
--color-symbolic-700: #645661;
--color-symbolic-800: #493f47;
--color-symbolic-900: #332b31;
--color-symbolic-950: #1e181d;
}SCSS
$symbolic: #b29ead;
$symbolic-rgb: 178, 158, 173;
$symbolic-light: mix(#fff, $symbolic, 20%);
$symbolic-dark: mix(#000, $symbolic, 20%);
.element {
color: $symbolic;
box-shadow: 0 0 0 2px rgba($symbolic, 0.35);
}