命名颜色 · #A9D1D7
Aqua Frost
Aqua Frost 即 #A9D1D7：rgb(169 209 215)、hsl(188 37% 75%)、oklch(0.834 0.043 207.6)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。
What does Cyan mean? → · Aqua Frost color name →
#A9D1D7
oklch(0.834 0.043 207.6)
颜色转换
- HEX
- #a9d1d7
- RGB
- rgb(169 209 215)
- HSL
- hsl(188 37% 75%)
- HWB
- hwb(188 66% 16%)
- OKLCH
- oklch(0.834 0.043 207.6)
- OKLab
- oklab(0.834 -0.038 -0.02)
- CIE Lab
- lab(81.1 -12.66 -7.58)
- LCH
- lch(81.1 14.76 210.9)
- CMYK
- cmyk(21% 3% 0% 16%)
浅色调 · 深色调 · 灰色调
浅色调
- B2D6DB
- BADADF
- C3DFE3
- CBE3E7
- D4E8EB
- DDEDEF
- E5F1F3
- EEF6F7
- F6FAFB
深色调
- 92B5BB
- 7C9B9F
- 678185
- 53686B
- 3F5052
- 2C393B
- 1B2325
- 0A1011
- 010202
灰色调
- A5C9CE
- A1C0C5
- 9DB8BC
- 99B0B3
- 95A8AB
- 91A0A2
- 8D9899
- 889091
- 848888
配色和谐
互补色 +180°
- A9D1D7
Aqua Frost
- E3BFB9
≈ Miniature Posey
类似色 -30° +30°
- A9D1D7
Aqua Frost
- ACD2C8
≈ Feeling Lucky
- AFCDE2
≈ Himalaya Blue
三角配色 +120° +240°
- A9D1D7
Aqua Frost
- D8BFD7
≈ Thistle
- D4C7A9
≈ Welcome Walkway
分裂互补色 +150° +210°
- A9D1D7
Aqua Frost
- E1BEC9
≈ Spring Pink
- DFC2AE
≈ Cinnamon Tea
四角配色 +90° +180° +270°
- A9D1D7
Aqua Frost
- CBC3E2
≈ Party Hat
- E3BFB9
≈ Miniature Posey
- C6CDAE
≈ Growing Season
对比度与无障碍
Ag
Fail白底
WCAG 1.64:1 · APCA Lc 28
Ag
AAA黑底
WCAG 12.78:1 · APCA Lc 74
最佳文字颜色: #000000
WCAG 12.78:1 (AAA) · APCA Lc 74
Contrast pairs
代码片段
CSS
:root {
--aqua-frost: #a9d1d7;
--aqua-frost-rgb: 169 209 215;
--aqua-frost-oklch: oklch(0.834 0.043 207.6);
}
.element {
color: var(--aqua-frost);
background-color: hsl(188 37% 75%);
border-color: oklch(0.834 0.043 207.6);
}Tailwind CSS v4
@theme {
--color-aqua-frost: #a9d1d7;
--color-aqua-frost-50: #e8f9fc;
--color-aqua-frost-100: #d8ecf0;
--color-aqua-frost-200: #c0dade;
--color-aqua-frost-300: #9fbec3;
--color-aqua-frost-400: #81a6ac;
--color-aqua-frost-500: #648f95;
--color-aqua-frost-600: #55797e;
--color-aqua-frost-700: #446165;
--color-aqua-frost-800: #31474a;
--color-aqua-frost-900: #213133;
--color-aqua-frost-950: #101d1f;
}SCSS
$aqua-frost: #a9d1d7;
$aqua-frost-rgb: 169, 209, 215;
$aqua-frost-light: mix(#fff, $aqua-frost, 20%);
$aqua-frost-dark: mix(#000, $aqua-frost, 20%);
.element {
color: $aqua-frost;
box-shadow: 0 0 0 2px rgba($aqua-frost, 0.35);
}