最接近的命名颜色 · #8FA9DE
#8FA9DE
最接近的命名颜色: Wisteria Blue
#8FA9DE(rgb(143 169 222)、hsl(220 54% 72%)、oklch(0.735 0.083 264.2))最接近命名颜色 Wisteria Blue。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度,以及 CSS、Tailwind v4 和 SCSS 代码。
#8FA9DE
oklch(0.735 0.083 264.2)
颜色转换
- HEX
- #8fa9de
- RGB
- rgb(143 169 222)
- HSL
- hsl(220 54% 72%)
- HWB
- hwb(220 56% 13%)
- OKLCH
- oklch(0.735 0.083 264.2)
- OKLab
- oklab(0.735 -0.008 -0.082)
- CIE Lab
- lab(68.74 0.39 -30.07)
- LCH
- lch(68.74 30.08 270.7)
- CMYK
- cmyk(36% 24% 0% 13%)
浅色调 · 深色调 · 灰色调
浅色调
- 9AB2E2
- A5BAE5
- B0C3E9
- BBCBEC
- C6D4EF
- D1DCF3
- DCE5F6
- E8EEF9
- F3F6FC
深色调
- 7C92C1
- 697CA5
- 576789
- 45536F
- 343F55
- 242C3D
- 151B26
- 070A12
- 010102
灰色调
- 8EA5D4
- 8CA1CB
- 8B9DC1
- 8999B8
- 8895AF
- 8691A5
- 858C9C
- 838893
- 828489
配色和谐
互补色 +180°
- 8FA9DE
Wisteria Blue
- C2A56C
≈ Hay Yellow
类似色 -30° +30°
- 8FA9DE
Wisteria Blue
- 73B2D6
≈ Skyscape
- AC9FD9
≈ Violet Velvet
三角配色 +120° +240°
- 8FA9DE
Wisteria Blue
- D99590
≈ Petite Orchid
- 89B788
≈ Aniseed Leaf Green
分裂互补色 +150° +210°
- 8FA9DE
Wisteria Blue
- D39B77
≈ Rustic Adobe
- A8AF72
≈ Estragon
四角配色 +90° +180° +270°
- 8FA9DE
Wisteria Blue
- D394AD
≈ Exotic Lilac
- C2A56C
≈ Hay Yellow
- 6EBBA5
≈ Larchmere
对比度与无障碍
Ag
Fail白底
WCAG 2.36:1 · APCA Lc 46
Ag
AAA黑底
WCAG 8.89:1 · APCA Lc 56
最佳文字颜色: #000000
WCAG 8.89:1 (AAA) · APCA Lc 56
Contrast pairs
代码片段
CSS
:root {
--wisteria-blue: #8fa9de;
--wisteria-blue-rgb: 143 169 222;
--wisteria-blue-oklch: oklch(0.735 0.083 264.2);
}
.element {
color: var(--wisteria-blue);
background-color: hsl(220 54% 72%);
border-color: oklch(0.735 0.083 264.2);
}Tailwind CSS v4
@theme {
--color-wisteria-blue: #8fa9de;
--color-wisteria-blue-50: #eaf5ff;
--color-wisteria-blue-100: #dbe8ff;
--color-wisteria-blue-200: #c4d4f9;
--color-wisteria-blue-300: #a4b7e3;
--color-wisteria-blue-400: #869ed0;
--color-wisteria-blue-500: #6a85bd;
--color-wisteria-blue-600: #5a71a0;
--color-wisteria-blue-700: #485a80;
--color-wisteria-blue-800: #33425f;
--color-wisteria-blue-900: #222e43;
--color-wisteria-blue-950: #121a2b;
}SCSS
$wisteria-blue: #8fa9de;
$wisteria-blue-rgb: 143, 169, 222;
$wisteria-blue-light: mix(#fff, $wisteria-blue, 20%);
$wisteria-blue-dark: mix(#000, $wisteria-blue, 20%);
.element {
color: $wisteria-blue;
box-shadow: 0 0 0 2px rgba($wisteria-blue, 0.35);
}