Color con nombre · #B8E4F5
Breaking the Ice
Breaking the Ice es #B8E4F5: rgb(184 228 245), hsl(197 75% 84%), oklch(0.893 0.051 223.4). Mira tintes, sombras, armonías, contraste WCAG y APCA, y código CSS, Tailwind v4 y SCSS.
What does Cyan mean? → · Breaking the Ice color name →
#B8E4F5
oklch(0.893 0.051 223.4)
Conversiones de color
- HEX
- #b8e4f5
- RGB
- rgb(184 228 245)
- HSL
- hsl(197 75% 84%)
- HWB
- hwb(197 72% 4%)
- OKLCH
- oklch(0.893 0.051 223.4)
- OKLab
- oklab(0.893 -0.037 -0.035)
- CIE Lab
- lab(87.88 -11.97 -13.25)
- LCH
- lch(87.88 17.85 227.9)
- CMYK
- cmyk(25% 7% 0% 4%)
Tintes · Sombras · Tonos
Tintes
- BFE7F6
- C7E9F7
- CEECF8
- D5EFF9
- DCF2FA
- E3F4FB
- EAF7FC
- F1FAFD
- F8FCFE
Sombras
- A0C6D5
- 88A9B6
- 718D98
- 5B727B
- 45585F
- 313F44
- 1E282B
- 0C1215
- 020303
Tonos
- B2DAE9
- ADCFDD
- A7C5D1
- A2BBC5
- 9CB1B9
- 97A7AD
- 919DA2
- 8B9396
- 868A8B
Armonías de color
Complementario +180°
- B8E4F5
Breaking the Ice
- FAD2C1
≈ Petal Soft
Análogo -30° +30°
- B8E4F5
Breaking the Ice
- B5E7E5
≈ Refreshing Pool
- C5DFFE
≈ Arc Light
Triádico +120° +240°
- B8E4F5
Breaking the Ice
- F5CFE5
≈ Sparkling Pink
- E1DEB7
≈ Tropical Tale
Complementario dividido +150° +210°
- B8E4F5
Breaking the Ice
- FCCFD2
≈ Fading Rose
- F1D7B7
≈ Pink Lady
Tetrádico +90° +180° +270°
- B8E4F5
Breaking the Ice
- E8D2F4
≈ Lavender Princess
- FAD2C1
≈ Petal Soft
- CFE4C1
≈ Irish Folklore
Contraste y accesibilidad
Ag
FailSobre blanco
WCAG 1.35:1 · APCA Lc 18
Ag
AAASobre negro
WCAG 15.45:1 · APCA Lc 86
Mejor color de texto: #000000
WCAG 15.45:1 (AAA) · APCA Lc 86
Contrast pairs
Fragmentos de código
CSS
:root {
--breaking-the-ice: #b8e4f5;
--breaking-the-ice-rgb: 184 228 245;
--breaking-the-ice-oklch: oklch(0.893 0.051 223.4);
}
.element {
color: var(--breaking-the-ice);
background-color: hsl(197 75% 84%);
border-color: oklch(0.893 0.051 223.4);
}Tailwind CSS v4
@theme {
--color-breaking-the-ice: #b8e4f5;
--color-breaking-the-ice-50: #e7f9ff;
--color-breaking-the-ice-100: #d7ecf5;
--color-breaking-the-ice-200: #bed9e5;
--color-breaking-the-ice-300: #9cbdcb;
--color-breaking-the-ice-400: #7ea6b5;
--color-breaking-the-ice-500: #608e9f;
--color-breaking-the-ice-600: #527887;
--color-breaking-the-ice-700: #41606c;
--color-breaking-the-ice-800: #2e474f;
--color-breaking-the-ice-900: #1f3137;
--color-breaking-the-ice-950: #0f1d22;
}SCSS
$breaking-the-ice: #b8e4f5;
$breaking-the-ice-rgb: 184, 228, 245;
$breaking-the-ice-light: mix(#fff, $breaking-the-ice, 20%);
$breaking-the-ice-dark: mix(#000, $breaking-the-ice, 20%);
.element {
color: $breaking-the-ice;
box-shadow: 0 0 0 2px rgba($breaking-the-ice, 0.35);
}