命名颜色 · #ECBAB3
Pink Cashmere
Pink Cashmere 即 #ECBAB3：rgb(236 186 179)、hsl(7 60% 81%)、oklch(0.832 0.059 27.6)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。
What does Pink mean? → · Pink Cashmere color name →
#ECBAB3
oklch(0.832 0.059 27.6)
颜色转换
- HEX
- #ecbab3
- RGB
- rgb(236 186 179)
- HSL
- hsl(7 60% 81%)
- HWB
- hwb(7 70% 7%)
- OKLCH
- oklch(0.832 0.059 27.6)
- OKLab
- oklab(0.832 0.052 0.027)
- CIE Lab
- lab(79.95 17.82 10.81)
- LCH
- lch(79.95 20.85 31.2)
- CMYK
- cmyk(0% 21% 24% 7%)
浅色调 · 深色调 · 灰色调
浅色调
- EEC1BA
- F0C8C2
- F2CFC9
- F5D5D1
- F6DCD9
- F8E3E0
- FAEAE8
- FCF1F0
- FDF8F7
深色调
- CDA19B
- AF8984
- 92726E
- 765C58
- 5B4643
- 42322F
- 291E1D
- 130D0C
- 030201
灰色调
- E1B4AE
- D6AEA9
- CBA8A3
- C0A39E
- B59D99
- AA9794
- A0918F
- 958B8A
- 8B8685
配色和谐
互补色 +180°
- ECBAB3
Pink Cashmere
- 9BD3DC
≈ Tourmaline Water Blue
类似色 -30° +30°
- ECBAB3
Pink Cashmere
- E9B9C8
≈ Chantilly
- E6BFA3
≈ Biscuit Beige
三角配色 +120° +240°
- ECBAB3
Pink Cashmere
- AFD3B2
≈ Enchanted Meadow
- B7C7EF
≈ Canterbury Bells
分裂互补色 +150° +210°
- ECBAB3
Pink Cashmere
- 9FD5C7
≈ Aqua Glow
- A4CEEA
≈ Cielo
四角配色 +90° +180° +270°
- ECBAB3
Pink Cashmere
- C4CEA2
≈ Dappled Daydream
- 9BD3DC
≈ Tourmaline Water Blue
- CCC0EA
≈ Violet Gems
对比度与无障碍
Ag
Fail白底
WCAG 1.71:1 · APCA Lc 31
Ag
AAA黑底
WCAG 12.24:1 · APCA Lc 72
最佳文字颜色: #000000
WCAG 12.24:1 (AAA) · APCA Lc 72
Contrast pairs
代码片段
CSS
:root {
--pink-cashmere: #ecbab3;
--pink-cashmere-rgb: 236 186 179;
--pink-cashmere-oklch: oklch(0.832 0.059 27.6);
}
.element {
color: var(--pink-cashmere);
background-color: hsl(7 60% 81%);
border-color: oklch(0.832 0.059 27.6);
}Tailwind CSS v4
@theme {
--color-pink-cashmere: #ecbab3;
--color-pink-cashmere-50: #ffefeb;
--color-pink-cashmere-100: #fbe1dd;
--color-pink-cashmere-200: #edcbc6;
--color-pink-cashmere-300: #d4ada6;
--color-pink-cashmere-400: #bf928b;
--color-pink-cashmere-500: #aa7771;
--color-pink-cashmere-600: #906560;
--color-pink-cashmere-700: #73514c;
--color-pink-cashmere-800: #553b38;
--color-pink-cashmere-900: #3b2826;
--color-pink-cashmere-950: #251615;
}SCSS
$pink-cashmere: #ecbab3;
$pink-cashmere-rgb: 236, 186, 179;
$pink-cashmere-light: mix(#fff, $pink-cashmere, 20%);
$pink-cashmere-dark: mix(#000, $pink-cashmere, 20%);
.element {
color: $pink-cashmere;
box-shadow: 0 0 0 2px rgba($pink-cashmere, 0.35);
}