命名颜色 · #C87F89
Grey Matter
Grey Matter 即 #C87F89：rgb(200 127 137)、hsl(352 40% 64%)、oklch(0.675 0.091 10.9)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。
What does Red mean? → · Grey Matter color name →
#C87F89
oklch(0.675 0.091 10.9)
颜色转换
- HEX
- #c87f89
- RGB
- rgb(200 127 137)
- HSL
- hsl(352 40% 64%)
- HWB
- hwb(352 50% 22%)
- OKLCH
- oklch(0.675 0.091 10.9)
- OKLab
- oklab(0.675 0.09 0.017)
- CIE Lab
- lab(61.29 29.98 7.06)
- LCH
- lch(61.29 30.8 13.3)
- CMYK
- cmyk(0% 37% 32% 22%)
浅色调 · 深色调 · 灰色调
浅色调
- CE8C94
- D498A0
- DAA5AB
- E0B1B7
- E6BEC2
- EBCBCE
- F0D8DA
- F5E5E6
- FAF2F3
深色调
- AE6E76
- 945D64
- 7B4C53
- 633C42
- 4C2D31
- 361F22
- 211114
- 0F0607
- 020101
灰色调
- C17F88
- BA8087
- B38086
- AC8085
- A58085
- 9E8084
- 978083
- 8F8082
- 888081
配色和谐
互补色 +180°
- C87F89
Grey Matter
- 47A9A4
≈ Tidal Teal
类似色 -30° +30°
- C87F89
Grey Matter
- BD80A8
≈ Romanov Mauve
- C7846B
≈ Cabana Melon
三角配色 +120° +240°
- C87F89
Grey Matter
- 83A366
≈ Pickle
- 6B9BCD
≈ Tantalise
分裂互补色 +150° +210°
- C87F89
Grey Matter
- 60A884
≈ Green Tourmaline
- 4EA4BE
≈ Pottery Blue
四角配色 +90° +180° +270°
- C87F89
Grey Matter
- A39953
≈ Formosan Green
- 47A9A4
≈ Tidal Teal
- 8C90CE
≈ Bailey Bells
对比度与无障碍
Ag
Fail白底
WCAG 3.06:1 · APCA Lc 57
Ag
AA黑底
WCAG 6.85:1 · APCA Lc 44
最佳文字颜色: #000000
WCAG 6.85:1 (AA) · APCA Lc 44
Contrast pairs
代码片段
CSS
:root {
--grey-matter: #c87f89;
--grey-matter-rgb: 200 127 137;
--grey-matter-oklch: oklch(0.675 0.091 10.9);
}
.element {
color: var(--grey-matter);
background-color: hsl(352 40% 64%);
border-color: oklch(0.675 0.091 10.9);
}Tailwind CSS v4
@theme {
--color-grey-matter: #c87f89;
--color-grey-matter-50: #ffebee;
--color-grey-matter-100: #ffdcdf;
--color-grey-matter-200: #f9c5c9;
--color-grey-matter-300: #e2a5aa;
--color-grey-matter-400: #ce8891;
--color-grey-matter-500: #ba6c77;
--color-grey-matter-600: #9d5b65;
--color-grey-matter-700: #7e4951;
--color-grey-matter-800: #5d353c;
--color-grey-matter-900: #412429;
--color-grey-matter-950: #2a1217;
}SCSS
$grey-matter: #c87f89;
$grey-matter-rgb: 200, 127, 137;
$grey-matter-light: mix(#fff, $grey-matter, 20%);
$grey-matter-dark: mix(#000, $grey-matter, 20%);
.element {
color: $grey-matter;
box-shadow: 0 0 0 2px rgba($grey-matter, 0.35);
}