Couleur nommée · #AFE3D6
Ice Cube
Ice Cube correspond à #AFE3D6 : rgb(175 227 214), hsl(165 48% 79%), oklch(0.876 0.056 177.9). Teintes, ombres, harmonies, contraste WCAG et APCA, et code CSS, Tailwind v4 et SCSS.
What does Teal mean? → · Ice Cube color name →
#AFE3D6
oklch(0.876 0.056 177.9)
Conversions de couleur
- HEX
- #afe3d6
- RGB
- rgb(175 227 214)
- HSL
- hsl(165 48% 79%)
- HWB
- hwb(165 69% 11%)
- OKLCH
- oklch(0.876 0.056 177.9)
- OKLab
- oklab(0.876 -0.056 0.002)
- CIE Lab
- lab(86.35 -19.33 0.62)
- LCH
- lch(86.35 19.34 178.2)
- CMYK
- cmyk(23% 0% 6% 11%)
Teintes · Ombres · Tons
Teintes
- B7E6DA
- BFE9DE
- C8ECE2
- D0EEE6
- D8F1EA
- E0F4EE
- E7F7F3
- EFF9F7
- F7FCFB
Ombres
- 98C5BA
- 81A89E
- 6B8C84
- 56716A
- 415752
- 2E3F3B
- 1C2725
- 0B1210
- 010302
Tons
- ABD9CD
- A6CEC4
- A1C4BB
- 9DBAB3
- 98B0AA
- 93A6A1
- 8F9D99
- 8A9391
- 858988
Harmonies de couleurs
Complémentaire +180°
- AFE3D6
Ice Cube
- F7C7D6
≈ Utterly Pink
Analogue -30° +30°
- AFE3D6
Ice Cube
- BEE1C2
≈ Mother Nature
- ABE1EA
≈ Powder Blue
Triadique +120° +240°
- AFE3D6
Ice Cube
- DACFF7
≈ Pale Lavender
- F4CEB2
≈ Royal Milk Tea
Complémentaire divisée +150° +210°
- AFE3D6
Ice Cube
- EBCAE9
≈ Sugar High
- F9C9C2
≈ Gossamer Pink
Tétradique +90° +180° +270°
Contraste et accessibilité
Ag
FailSur blanc
WCAG 1.42:1 · APCA Lc 20
Ag
AAASur noir
WCAG 14.78:1 · APCA Lc 83
Meilleure couleur de texte: #000000
WCAG 14.78:1 (AAA) · APCA Lc 83
Contrast pairs
Extraits de code
CSS
:root {
--ice-cube: #afe3d6;
--ice-cube-rgb: 175 227 214;
--ice-cube-oklch: oklch(0.876 0.056 177.9);
}
.element {
color: var(--ice-cube);
background-color: hsl(165 48% 79%);
border-color: oklch(0.876 0.056 177.9);
}Tailwind CSS v4
@theme {
--color-ice-cube: #afe3d6;
--color-ice-cube-50: #e5fbf6;
--color-ice-cube-100: #d5eee8;
--color-ice-cube-200: #bbddd5;
--color-ice-cube-300: #99c1b8;
--color-ice-cube-400: #7aaa9e;
--color-ice-cube-500: #5b9386;
--color-ice-cube-600: #4e7c71;
--color-ice-cube-700: #3e635b;
--color-ice-cube-800: #2d4941;
--color-ice-cube-900: #1e332d;
--color-ice-cube-950: #0e1e1a;
}SCSS
$ice-cube: #afe3d6;
$ice-cube-rgb: 175, 227, 214;
$ice-cube-light: mix(#fff, $ice-cube, 20%);
$ice-cube-dark: mix(#000, $ice-cube, 20%);
.element {
color: $ice-cube;
box-shadow: 0 0 0 2px rgba($ice-cube, 0.35);
}