命名颜色 · #BA87AA
Sunset Horizon
Sunset Horizon 即 #BA87AA：rgb(186 135 170)、hsl(319 27% 63%)、oklch(0.684 0.078 338.5)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。
What does Pink mean? → · Sunset Horizon color name →
#BA87AA
oklch(0.684 0.078 338.5)
颜色转换
- HEX
- #ba87aa
- RGB
- rgb(186 135 170)
- HSL
- hsl(319 27% 63%)
- HWB
- hwb(319 53% 27%)
- OKLCH
- oklch(0.684 0.078 338.5)
- OKLab
- oklab(0.684 0.073 -0.029)
- CIE Lab
- lab(62.28 24.26 -10.49)
- LCH
- lch(62.28 26.43 336.6)
- CMYK
- cmyk(0% 27% 9% 27%)
浅色调 · 深色调 · 灰色调
浅色调
- C193B2
- C89EBB
- CFAAC3
- D6B6CB
- DDC2D4
- E4CEDC
- EBDAE5
- F2E6EE
- F8F3F6
深色调
- A17593
- 89637D
- 725168
- 5C4153
- 46313F
- 32212D
- 1E131B
- 0D060B
- 020101
灰色调
- B486A6
- AF86A2
- A9859D
- A38599
- 9D8495
- 988391
- 92838C
- 8C8288
- 868184
配色和谐
互补色 +180°
- BA87AA
Sunset Horizon
- 6FA988
≈ Green Globe
类似色 -30° +30°
- BA87AA
Sunset Horizon
- A78DBF
≈ East Side
- C48690
≈ King’s Cloak
三角配色 +120° +240°
- BA87AA
Sunset Horizon
- A69B61
≈ Tallarn Sand
- 5EA5BA
≈ Pacific Palisade
分裂互补色 +150° +210°
- BA87AA
Sunset Horizon
- 8BA36F
≈ Putrid Green
- 5BA9A3
≈ Dragon Bay
四角配色 +90° +180° +270°
- BA87AA
Sunset Horizon
- BA9164
≈ Honey Haven
- 6FA988
≈ Green Globe
- 739EC8
≈ Blue Lechery
对比度与无障碍
Ag
Fail白底
WCAG 2.94:1 · APCA Lc 56
Ag
AAA黑底
WCAG 7.13:1 · APCA Lc 46
最佳文字颜色: #000000
WCAG 7.13:1 (AAA) · APCA Lc 46
Contrast pairs
代码片段
CSS
:root {
--sunset-horizon: #ba87aa;
--sunset-horizon-rgb: 186 135 170;
--sunset-horizon-oklch: oklch(0.684 0.078 338.5);
}
.element {
color: var(--sunset-horizon);
background-color: hsl(319 27% 63%);
border-color: oklch(0.684 0.078 338.5);
}Tailwind CSS v4
@theme {
--color-sunset-horizon: #ba87aa;
--color-sunset-horizon-50: #ffedfc;
--color-sunset-horizon-100: #fbdef0;
--color-sunset-horizon-200: #ecc8de;
--color-sunset-horizon-300: #d4a8c4;
--color-sunset-horizon-400: #be8dae;
--color-sunset-horizon-500: #a87298;
--color-sunset-horizon-600: #8e6180;
--color-sunset-horizon-700: #724d67;
--color-sunset-horizon-800: #54384c;
--color-sunset-horizon-900: #3a2635;
--color-sunset-horizon-950: #241420;
}SCSS
$sunset-horizon: #ba87aa;
$sunset-horizon-rgb: 186, 135, 170;
$sunset-horizon-light: mix(#fff, $sunset-horizon, 20%);
$sunset-horizon-dark: mix(#000, $sunset-horizon, 20%);
.element {
color: $sunset-horizon;
box-shadow: 0 0 0 2px rgba($sunset-horizon, 0.35);
}