Cor nomeada · #C3FBF4
Glacial Drift
Glacial Drift é #C3FBF4: rgb(195 251 244), hsl(173 88% 87%), oklch(0.948 0.057 186.8). Veja tons claros, sombras, harmonias, contraste WCAG e APCA e código CSS, Tailwind v4 e SCSS.
What does Teal mean? → · Glacial Drift color name →
#C3FBF4
oklch(0.948 0.057 186.8)
Conversões de cor
- HEX
- #c3fbf4
- RGB
- rgb(195 251 244)
- HSL
- hsl(173 88% 87%)
- HWB
- hwb(173 76% 2%)
- OKLCH
- oklch(0.948 0.057 186.8)
- OKLab
- oklab(0.948 -0.057 -0.007)
- CIE Lab
- lab(94.65 -19.37 -2.73)
- LCH
- lch(94.65 19.56 188)
- CMYK
- cmyk(22% 0% 3% 2%)
Tons claros · Sombras · Tons
Tons claros
- C9FBF5
- D0FCF6
- D6FCF7
- DCFDF8
- E2FDF9
- E8FEFB
- EEFEFC
- F4FEFD
- F9FFFE
Sombras
- A9DAD4
- 90BAB5
- 789C97
- 607E7A
- 4A615E
- 344644
- 202D2B
- 0E1514
- 020303
Tons
- BCEEE8
- B6E1DC
- AFD5D0
- A9C8C4
- A2BCB8
- 9BB0AD
- 94A3A1
- 8E9796
- 878C8B
Harmonias de cor
Complementar +180°
- C3FBF4
Glacial Drift
- FFE7EB
≈ Porcelain Skin
Análoga -30° +30°
- C3FBF4
Glacial Drift
- D0FADF
≈ Cactus Water
- D2F5FF
≈ Water
Tríade +120° +240°
- C3FBF4
Glacial Drift
- F3E9FF
≈ Placebo Purple
- FFEAD5
≈ Winter Morning
Complementar dividida +150° +210°
- C3FBF4
Glacial Drift
- FFE5F7
≈ Bunny Tail
- FFE8E2
≈ Translucent Silk
Tétrade +90° +180° +270°
- C3FBF4
Glacial Drift
- E9EDFF
≈ Brilliant White
- FFE7EB
≈ Porcelain Skin
- F8EFC3
≈ Champagne Tickle
Contraste e acessibilidade
Ag
FailSobre branco
WCAG 1.13:1 · APCA Lc 0
Ag
AAASobre preto
WCAG 18.42:1 · APCA Lc 98
Melhor cor de texto: #000000
WCAG 18.42:1 (AAA) · APCA Lc 98
Contrast pairs
Trechos de código
CSS
:root {
--glacial-drift: #c3fbf4;
--glacial-drift-rgb: 195 251 244;
--glacial-drift-oklch: oklch(0.948 0.057 186.8);
}
.element {
color: var(--glacial-drift);
background-color: hsl(173 88% 87%);
border-color: oklch(0.948 0.057 186.8);
}Tailwind CSS v4
@theme {
--color-glacial-drift: #c3fbf4;
--color-glacial-drift-50: #e4fbf8;
--color-glacial-drift-100: #d3eeec;
--color-glacial-drift-200: #baddd9;
--color-glacial-drift-300: #96c1bd;
--color-glacial-drift-400: #77aaa4;
--color-glacial-drift-500: #57938c;
--color-glacial-drift-600: #4b7c77;
--color-glacial-drift-700: #3b635f;
--color-glacial-drift-800: #2a4945;
--color-glacial-drift-900: #1d3330;
--color-glacial-drift-950: #0c1e1c;
}SCSS
$glacial-drift: #c3fbf4;
$glacial-drift-rgb: 195, 251, 244;
$glacial-drift-light: mix(#fff, $glacial-drift, 20%);
$glacial-drift-dark: mix(#000, $glacial-drift, 20%);
.element {
color: $glacial-drift;
box-shadow: 0 0 0 2px rgba($glacial-drift, 0.35);
}