最接近的命名颜色 · #ACD1EA
#ACD1EA
最接近的命名颜色: Vive le Vent
#ACD1EA（rgb(172 209 234)、hsl(204 60% 80%)、oklch(0.842 0.053 237.8)）最接近命名颜色 Vive le Vent。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。
#ACD1EA
oklch(0.842 0.053 237.8)
颜色转换
- HEX
- #acd1ea
- RGB
- rgb(172 209 234)
- HSL
- hsl(204 60% 80%)
- HWB
- hwb(204 67% 8%)
- OKLCH
- oklch(0.842 0.053 237.8)
- OKLab
- oklab(0.842 -0.028 -0.045)
- CIE Lab
- lab(81.77 -8.49 -16.63)
- LCH
- lch(81.77 18.67 243)
- CMYK
- cmyk(26% 11% 0% 8%)
浅色调 · 深色调 · 灰色调
浅色调
- B4D6EC
- BDDAEE
- C5DFF1
- CDE3F3
- D5E8F5
- DEEDF7
- E6F1F9
- EEF6FB
- F7FAFD
深色调
- 95B5CB
- 7F9BAE
- 698191
- 546875
- 40505A
- 2D3941
- 1B2329
- 0B1013
- 010203
灰色调
- A8C9DF
- A3C0D4
- 9FB8C9
- 9BB0BE
- 96A8B4
- 92A0A9
- 8D989F
- 899094
- 85888A
配色和谐
互补色 +180°
- ACD1EA
Vive le Vent
- E6C3AA
≈ Peach Beauty
类似色 -30° +30°
- ACD1EA
Vive le Vent
- A4D5DD
≈ Midwinter Mist
- BCCBEF
≈ Cuddle
三角配色 +120° +240°
- ACD1EA
Vive le Vent
- E9BECB
≈ Childlike
- C8D0AA
≈ Bamboo White
分裂互补色 +150° +210°
- ACD1EA
Vive le Vent
- ECBFB8
≈ Rosewood Dreams
- DACAA5
≈ Glamorgan Sausage
四角配色 +90° +180° +270°
- ACD1EA
Vive le Vent
- DFC0DD
≈ Epiphany
- E6C3AA
≈ Peach Beauty
- B5D5B8
≈ Enchanted Meadow
对比度与无障碍
Ag
Fail白底
WCAG 1.60:1 · APCA Lc 27
Ag
AAA黑底
WCAG 13.06:1 · APCA Lc 76
最佳文字颜色: #000000
WCAG 13.06:1 (AAA) · APCA Lc 76
Contrast pairs
代码片段
CSS
:root {
--vive-le-vent: #acd1ea;
--vive-le-vent-rgb: 172 209 234;
--vive-le-vent-oklch: oklch(0.842 0.053 237.8);
}
.element {
color: var(--vive-le-vent);
background-color: hsl(204 60% 80%);
border-color: oklch(0.842 0.053 237.8);
}Tailwind CSS v4
@theme {
--color-vive-le-vent: #acd1ea;
--color-vive-le-vent-50: #e8f8ff;
--color-vive-le-vent-100: #d9ebf8;
--color-vive-le-vent-200: #c1d8e9;
--color-vive-le-vent-300: #a0bcd0;
--color-vive-le-vent-400: #82a4ba;
--color-vive-le-vent-500: #658ca5;
--color-vive-le-vent-600: #56768c;
--color-vive-le-vent-700: #445f70;
--color-vive-le-vent-800: #314552;
--color-vive-le-vent-900: #213039;
--color-vive-le-vent-950: #101c24;
}SCSS
$vive-le-vent: #acd1ea;
$vive-le-vent-rgb: 172, 209, 234;
$vive-le-vent-light: mix(#fff, $vive-le-vent, 20%);
$vive-le-vent-dark: mix(#000, $vive-le-vent, 20%);
.element {
color: $vive-le-vent;
box-shadow: 0 0 0 2px rgba($vive-le-vent, 0.35);
}