最接近的命名颜色 · #A5D1E9
#A5D1E9
最接近的命名颜色: Vive le Vent
#A5D1E9(rgb(165 209 233)、hsl(201 61% 78%)、oklch(0.837 0.057 232.2))最接近命名颜色 Vive le Vent。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度,以及 CSS、Tailwind v4 和 SCSS 代码。
#A5D1E9
oklch(0.837 0.057 232.2)
颜色转换
- HEX
- #a5d1e9
- RGB
- rgb(165 209 233)
- HSL
- hsl(201 61% 78%)
- HWB
- hwb(201 65% 9%)
- OKLCH
- oklch(0.837 0.057 232.2)
- OKLab
- oklab(0.837 -0.035 -0.045)
- CIE Lab
- lab(81.3 -10.81 -16.86)
- LCH
- lch(81.3 20.03 237.3)
- CMYK
- cmyk(29% 10% 0% 9%)
浅色调 · 深色调 · 灰色调
浅色调
- AED6EB
- B7DAEE
- C0DFF0
- C9E3F2
- D2E8F4
- DBEDF6
- E4F1F9
- EDF6FB
- F6FAFD
深色调
- 8FB5CB
- 799BAD
- 658190
- 516874
- 3D505A
- 2B3941
- 1A2329
- 0A1013
- 010203
灰色调
- A2C9DE
- 9EC0D3
- 9AB8C8
- 97B0BE
- 93A8B3
- 8FA0A9
- 8C989E
- 889094
- 84888A
配色和谐
互补色 +180°
- A5D1E9
Vive le Vent
- E9C0A8
≈ Copper Blush
类似色 -30° +30°
- A5D1E9
Vive le Vent
- 9ED5DA
≈ Dulcet
- B6CBF0
≈ Cuddle
三角配色 +120° +240°
- A5D1E9
Vive le Vent
- E8BBCD
≈ Pink Mist
- CACEA4
≈ Baize Green
分裂互补色 +150° +210°
- A5D1E9
Vive le Vent
- EDBCB9
≈ Pink Sachet
- DCC7A0
≈ Classic Khaki
四角配色 +90° +180° +270°
- A5D1E9
Vive le Vent
- DCBEE0
≈ Sky Blue Pink
- E9C0A8
≈ Copper Blush
- B5D4B2
≈ Flower Stem
对比度与无障碍
Ag
Fail白底
WCAG 1.62:1 · APCA Lc 28
Ag
AAA黑底
WCAG 12.89:1 · APCA Lc 75
最佳文字颜色: #000000
WCAG 12.89:1 (AAA) · APCA Lc 75
Contrast pairs
代码片段
CSS
:root {
--vive-le-vent: #a5d1e9;
--vive-le-vent-rgb: 165 209 233;
--vive-le-vent-oklch: oklch(0.837 0.057 232.2);
}
.element {
color: var(--vive-le-vent);
background-color: hsl(201 61% 78%);
border-color: oklch(0.837 0.057 232.2);
}Tailwind CSS v4
@theme {
--color-vive-le-vent: #a5d1e9;
--color-vive-le-vent-50: #e6f8ff;
--color-vive-le-vent-100: #d6ecf8;
--color-vive-le-vent-200: #bdd9e9;
--color-vive-le-vent-300: #9cbdd1;
--color-vive-le-vent-400: #7da5bb;
--color-vive-le-vent-500: #5f8da6;
--color-vive-le-vent-600: #51778c;
--color-vive-le-vent-700: #406070;
--color-vive-le-vent-800: #2d4652;
--color-vive-le-vent-900: #1f313a;
--color-vive-le-vent-950: #0e1d24;
}SCSS
$vive-le-vent: #a5d1e9;
$vive-le-vent-rgb: 165, 209, 233;
$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);
}