命名颜色 · #BBEEFF
Ice Effect
Ice Effect 即 #BBEEFF：rgb(187 238 255)、hsl(195 100% 87%)、oklch(0.919 0.057 220.2)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。
What does Cyan mean? → · Ice Effect color name →
#BBEEFF
oklch(0.919 0.057 220.2)
颜色转换
- HEX
- #bbeeff
- RGB
- rgb(187 238 255)
- HSL
- hsl(195 100% 87%)
- HWB
- hwb(195 73% 0%)
- OKLCH
- oklch(0.919 0.057 220.2)
- OKLab
- oklab(0.919 -0.043 -0.037)
- CIE Lab
- lab(90.97 -14.05 -13.86)
- LCH
- lch(90.97 19.73 224.6)
- CMYK
- cmyk(27% 7% 0% 0%)
浅色调 · 深色调 · 灰色调
浅色调
- C2F0FF
- C9F2FF
- D0F3FF
- D7F5FF
- DEF7FF
- E5F8FF
- EBFAFF
- F2FCFF
- F8FDFF
深色调
- A2CFDE
- 8AB1BE
- 73939E
- 5C7780
- 465C63
- 324248
- 1F2A2E
- 0D1416
- 020303
灰色调
- B5E3F2
- AFD7E4
- AACCD7
- A4C1CA
- 9EB6BE
- 98ABB1
- 92A0A4
- 8C9598
- 868A8C
配色和谐
互补色 +180°
- BBEEFF
Ice Effect
- FFDCCF
≈ Glazed Sugar
类似色 -30° +30°
- BBEEFF
Ice Effect
- B9F1ED
≈ Cold Blooded
- D1E7FF
≈ Veiling Waterfalls
三角配色 +120° +240°
- BBEEFF
Ice Effect
- FFD7F0
≈ Sweet Sachet
- EDE6BB
≈ Slices of Happy
分裂互补色 +150° +210°
- BBEEFF
Ice Effect
- FFD9DE
≈ Satin Ribbon
- FEDFBC
≈ Almondine
四角配色 +90° +180° +270°
- BBEEFF
Ice Effect
- EFDBFF
≈ Lavender Savour
- FFDCCF
≈ Glazed Sugar
- D8EDC5
≈ Greenette
对比度与无障碍
Ag
Fail白底
WCAG 1.25:1 · APCA Lc 12
Ag
AAA黑底
WCAG 16.78:1 · APCA Lc 92
最佳文字颜色: #000000
WCAG 16.78:1 (AAA) · APCA Lc 92
Contrast pairs
代码片段
CSS
:root {
--ice-effect: #bbeeff;
--ice-effect-rgb: 187 238 255;
--ice-effect-oklch: oklch(0.919 0.057 220.2);
}
.element {
color: var(--ice-effect);
background-color: hsl(195 100% 87%);
border-color: oklch(0.919 0.057 220.2);
}Tailwind CSS v4
@theme {
--color-ice-effect: #bbeeff;
--color-ice-effect-50: #e4f9ff;
--color-ice-effect-100: #d4edf6;
--color-ice-effect-200: #bbdae6;
--color-ice-effect-300: #98bfcd;
--color-ice-effect-400: #79a7b6;
--color-ice-effect-500: #598fa1;
--color-ice-effect-600: #4c7988;
--color-ice-effect-700: #3d616d;
--color-ice-effect-800: #2b4750;
--color-ice-effect-900: #1d3137;
--color-ice-effect-950: #0d1d22;
}SCSS
$ice-effect: #bbeeff;
$ice-effect-rgb: 187, 238, 255;
$ice-effect-light: mix(#fff, $ice-effect, 20%);
$ice-effect-dark: mix(#000, $ice-effect, 20%);
.element {
color: $ice-effect;
box-shadow: 0 0 0 2px rgba($ice-effect, 0.35);
}