命名颜色 · #89CFDB
Bluish Water
Bluish Water 即 #89CFDB：rgb(137 207 219)、hsl(189 53% 70%)、oklch(0.812 0.072 209.4)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。
What does Cyan mean? → · Bluish Water color name →
#89CFDB
oklch(0.812 0.072 209.4)
颜色转换
- HEX
- #89cfdb
- RGB
- rgb(137 207 219)
- HSL
- hsl(189 53% 70%)
- HWB
- hwb(189 54% 14%)
- OKLCH
- oklch(0.812 0.072 209.4)
- OKLab
- oklab(0.812 -0.063 -0.035)
- CIE Lab
- lab(78.81 -20.6 -13.33)
- LCH
- lch(78.81 24.54 212.9)
- CMYK
- cmyk(37% 5% 0% 14%)
浅色调 · 深色调 · 灰色调
浅色调
- 96D4DF
- A2D9E2
- AEDEE6
- BAE2E9
- C6E7ED
- D1ECF1
- DDF1F4
- E8F6F8
- F4FAFB
深色调
- 76B4BE
- 6499A2
- 537F87
- 42676D
- 314F54
- 22383C
- 142326
- 071011
- 010202
灰色调
- 89C7D2
- 89BFC8
- 88B7BF
- 88AFB6
- 87A7AD
- 869FA3
- 85979A
- 838F92
- 828889
配色和谐
互补色 +180°
- 89CFDB
Bluish Water
- EDB1A7
≈ Lusty Salmon
类似色 -30° +30°
- 89CFDB
Bluish Water
- 8DD1C3
≈ Green Daze
- 97C9EC
≈ Honolulu
三角配色 +120° +240°
- 89CFDB
Bluish Water
- DDB1D9
≈ Blushing Sky
- D4C08C
≈ Monument Green
分裂互补色 +150° +210°
- 89CFDB
Bluish Water
- EAAFC0
≈ Fallen Blossoms
- E5B793
≈ Southern Peach
四角配色 +90° +180° +270°
- 89CFDB
Bluish Water
- C8B8EA
≈ Connecticut Lilac
- EDB1A7
≈ Lusty Salmon
- BCC994
≈ White Grape
对比度与无障碍
Ag
Fail白底
WCAG 1.74:1 · APCA Lc 32
Ag
AAA黑底
WCAG 12.01:1 · APCA Lc 71
最佳文字颜色: #000000
WCAG 12.01:1 (AAA) · APCA Lc 71
Contrast pairs
代码片段
CSS
:root {
--bluish-water: #89cfdb;
--bluish-water-rgb: 137 207 219;
--bluish-water-oklch: oklch(0.812 0.072 209.4);
}
.element {
color: var(--bluish-water);
background-color: hsl(189 53% 70%);
border-color: oklch(0.812 0.072 209.4);
}Tailwind CSS v4
@theme {
--color-bluish-water: #89cfdb;
--color-bluish-water-50: #dffbff;
--color-bluish-water-100: #ceeff6;
--color-bluish-water-200: #b2dde6;
--color-bluish-water-300: #8cc2cd;
--color-bluish-water-400: #69abb6;
--color-bluish-water-500: #4493a0;
--color-bluish-water-600: #3b7d87;
--color-bluish-water-700: #2f646c;
--color-bluish-water-800: #20494f;
--color-bluish-water-900: #153337;
--color-bluish-water-950: #061f22;
}SCSS
$bluish-water: #89cfdb;
$bluish-water-rgb: 137, 207, 219;
$bluish-water-light: mix(#fff, $bluish-water, 20%);
$bluish-water-dark: mix(#000, $bluish-water, 20%);
.element {
color: $bluish-water;
box-shadow: 0 0 0 2px rgba($bluish-water, 0.35);
}