命名颜色 · #897F98
Grey Dusk
Grey Dusk 即 #897F98:rgb(137 127 152)、hsl(264 11% 55%)、oklch(0.614 0.039 303.4)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度,以及 CSS、Tailwind v4 和 SCSS 代码。
What does Purple mean? → · Grey Dusk color name →
#897F98
oklch(0.614 0.039 303.4)
颜色转换
- HEX
- #897f98
- RGB
- rgb(137 127 152)
- HSL
- hsl(264 11% 55%)
- HWB
- hwb(264 50% 40%)
- OKLCH
- oklch(0.614 0.039 303.4)
- OKLab
- oklab(0.614 0.021 -0.032)
- CIE Lab
- lab(54.75 7.71 -12.05)
- LCH
- lch(54.75 14.31 302.6)
- CMYK
- cmyk(10% 16% 0% 40%)
浅色调 · 深色调 · 灰色调
浅色调
- 948BA2
- 9F97AC
- ABA4B6
- B7B0C0
- C2BDCB
- CECAD5
- DAD7DF
- E6E4EA
- F3F2F4
深色调
- 766E84
- 645D70
- 534C5C
- 423C4A
- 312D38
- 221F27
- 141117
- 070608
- 010101
灰色调
- 887F96
- 877F93
- 867F91
- 85808E
- 84808C
- 84808A
- 838087
- 828085
- 818082
配色和谐
互补色 +180°
- 897F98
Grey Dusk
- 80896F
≈ Shebang
类似色 -30° +30°
- 897F98
Grey Dusk
- 7C839C
≈ Tempest
- 937C8E
≈ Plum Swirl
三角配色 +120° +240°
- 897F98
Grey Dusk
- 96806C
≈ Sofisticata
- 6B8C87
≈ Aspen Hush
分裂互补色 +150° +210°
- 897F98
Grey Dusk
- 8C846A
≈ Brown Grey
- 738C7A
≈ Hedge Green
四角配色 +90° +180° +270°
- 897F98
Grey Dusk
- 9A7C75
≈ Wild Hemp
- 80896F
≈ Shebang
- 6A8B93
≈ Blue Shoal
对比度与无障碍
Ag
Fail白底
WCAG 3.78:1 · APCA Lc 65
Ag
AA黑底
WCAG 5.55:1 · APCA Lc 36
最佳文字颜色: #000000
WCAG 5.55:1 (AA) · APCA Lc 36
Contrast pairs
代码片段
CSS
:root {
--grey-dusk: #897f98;
--grey-dusk-rgb: 137 127 152;
--grey-dusk-oklch: oklch(0.614 0.039 303.4);
}
.element {
color: var(--grey-dusk);
background-color: hsl(264 11% 55%);
border-color: oklch(0.614 0.039 303.4);
}Tailwind CSS v4
@theme {
--color-grey-dusk: #897f98;
--color-grey-dusk-50: #f8f3fe;
--color-grey-dusk-100: #ebe5f3;
--color-grey-dusk-200: #d8d0e2;
--color-grey-dusk-300: #bcb3c8;
--color-grey-dusk-400: #a399b2;
--color-grey-dusk-500: #8b809c;
--color-grey-dusk-600: #766d84;
--color-grey-dusk-700: #5e5769;
--color-grey-dusk-800: #453f4e;
--color-grey-dusk-900: #2f2c36;
--color-grey-dusk-950: #1c1921;
}SCSS
$grey-dusk: #897f98;
$grey-dusk-rgb: 137, 127, 152;
$grey-dusk-light: mix(#fff, $grey-dusk, 20%);
$grey-dusk-dark: mix(#000, $grey-dusk, 20%);
.element {
color: $grey-dusk;
box-shadow: 0 0 0 2px rgba($grey-dusk, 0.35);
}