最接近的命名颜色 · #ABD0F2
#ABD0F2
最接近的命名颜色: Andromeda Blue
#ABD0F2（rgb(171 208 242)、hsl(209 73% 81%)、oklch(0.842 0.062 246.3)）最接近命名颜色 Andromeda Blue。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。
#ABD0F2
oklch(0.842 0.062 246.3)
颜色转换
- HEX
- #abd0f2
- RGB
- rgb(171 208 242)
- HSL
- hsl(209 73% 81%)
- HWB
- hwb(209 67% 5%)
- OKLCH
- oklch(0.842 0.062 246.3)
- OKLab
- oklab(0.842 -0.025 -0.057)
- CIE Lab
- lab(81.65 -6.88 -21.05)
- LCH
- lch(81.65 22.15 251.9)
- CMYK
- cmyk(29% 14% 0% 5%)
浅色调 · 深色调 · 灰色调
浅色调
- B3D5F3
- BCD9F5
- C4DEF6
- CDE3F8
- D5E8F9
- DDECFA
- E6F1FB
- EEF6FD
- F7FAFE
深色调
- 94B5D2
- 7E9AB4
- 688096
- 546779
- 404F5E
- 2D3943
- 1B232B
- 0B1014
- 010203
灰色调
- A7C8E6
- A3C0DA
- 9EB7CF
- 9AAFC3
- 96A7B8
- 919FAC
- 8D97A1
- 899096
- 84888B
配色和谐
互补色 +180°
- ABD0F2
Andromeda Blue
- E8C4A1
≈ Toasted Coconut
类似色 -30° +30°
- ABD0F2
Andromeda Blue
- 9DD6E5
≈ Oceano
- C0C9F4
≈ Light Periwinkle
三角配色 +120° +240°
- ABD0F2
Andromeda Blue
- F0BBC5
≈ Petals Unfolding
- C1D3A8
≈ Romaine
分裂互补色 +150° +210°
- ABD0F2
Andromeda Blue
- F0BEB0
≈ Madder Orange
- D7CC9E
≈ Tahuna Sands
四角配色 +90° +180° +270°
- ABD0F2
Andromeda Blue
- E6BDDB
≈ Blackberry Yoghurt
- E8C4A1
≈ Toasted Coconut
- ABD8BB
≈ Shanghai Jade
对比度与无障碍
Ag
Fail白底
WCAG 1.61:1 · APCA Lc 27
Ag
AAA黑底
WCAG 13.03:1 · APCA Lc 76
最佳文字颜色: #000000
WCAG 13.03:1 (AAA) · APCA Lc 76
Contrast pairs
代码片段
CSS
:root {
--andromeda-blue: #abd0f2;
--andromeda-blue-rgb: 171 208 242;
--andromeda-blue-oklch: oklch(0.842 0.062 246.3);
}
.element {
color: var(--andromeda-blue);
background-color: hsl(209 73% 81%);
border-color: oklch(0.842 0.062 246.3);
}Tailwind CSS v4
@theme {
--color-andromeda-blue: #abd0f2;
--color-andromeda-blue-50: #e8f7ff;
--color-andromeda-blue-100: #d8eafc;
--color-andromeda-blue-200: #c0d7ee;
--color-andromeda-blue-300: #9fbbd6;
--color-andromeda-blue-400: #81a3c1;
--color-andromeda-blue-500: #648aad;
--color-andromeda-blue-600: #557592;
--color-andromeda-blue-700: #445e75;
--color-andromeda-blue-800: #304556;
--color-andromeda-blue-900: #20303c;
--color-andromeda-blue-950: #101c26;
}SCSS
$andromeda-blue: #abd0f2;
$andromeda-blue-rgb: 171, 208, 242;
$andromeda-blue-light: mix(#fff, $andromeda-blue, 20%);
$andromeda-blue-dark: mix(#000, $andromeda-blue, 20%);
.element {
color: $andromeda-blue;
box-shadow: 0 0 0 2px rgba($andromeda-blue, 0.35);
}