Couleur nommée la plus proche · #AFD3D6
#AFD3D6
Couleur nommée la plus proche: Clear Water
#AFD3D6 (rgb(175 211 214), hsl(185 32% 76%), oklch(0.842 0.038 202.7)) est la plus proche de la couleur nommée Clear Water. Teintes, ombres, harmonies, contraste WCAG et APCA, et code CSS, Tailwind v4 et SCSS.
#AFD3D6
oklch(0.842 0.038 202.7)
Conversions de couleur
- HEX
- #afd3d6
- RGB
- rgb(175 211 214)
- HSL
- hsl(185 32% 76%)
- HWB
- hwb(185 69% 16%)
- OKLCH
- oklch(0.842 0.038 202.7)
- OKLab
- oklab(0.842 -0.035 -0.015)
- CIE Lab
- lab(82.01 -11.84 -5.67)
- LCH
- lch(82.01 13.13 205.6)
- CMYK
- cmyk(18% 1% 0% 16%)
Teintes · Ombres · Tons
Teintes
- B7D7DA
- BFDCDE
- C7E0E2
- CFE5E6
- D7E9EA
- DFEDEE
- E7F2F3
- EFF6F7
- F7FBFB
Ombres
- 98B7BA
- 819C9E
- 6B8284
- 56696A
- 415152
- 2E3A3B
- 1C2425
- 0B1010
- 010202
Tons
- AACACD
- A6C2C4
- A1B9BB
- 9CB1B3
- 98A9AA
- 93A0A1
- 8E9899
- 8A9091
- 858888
Harmonies de couleurs
Complémentaire +180°
- AFD3D6
Clear Water
- E3C2C0
≈ Spice Girl
Analogue -30° +30°
- AFD3D6
Clear Water
- B3D4C8
≈ Little Beaux Blue
- B3D0E0
≈ Holiday Road
Triadique +120° +240°
- AFD3D6
Clear Water
- D8C3DA
≈ Simply Lavender
- D7C9B0
≈ Wood Ash
Complémentaire divisée +150° +210°
- AFD3D6
Clear Water
- E0C1CD
≈ In the Slip
- E0C5B5
≈ Birthday Suit
Tétradique +90° +180° +270°
- AFD3D6
Clear Water
- CBC7E3
≈ Purple Purity
- E3C2C0
≈ Spice Girl
- CBCEB2
≈ Chilled Cucumber
Contraste et accessibilité
Ag
FailSur blanc
WCAG 1.60:1 · APCA Lc 27
Ag
AAASur noir
WCAG 13.11:1 · APCA Lc 76
Meilleure couleur de texte: #000000
WCAG 13.11:1 (AAA) · APCA Lc 76
Contrast pairs
Extraits de code
CSS
:root {
--clear-water: #afd3d6;
--clear-water-rgb: 175 211 214;
--clear-water-oklch: oklch(0.842 0.038 202.7);
}
.element {
color: var(--clear-water);
background-color: hsl(185 32% 76%);
border-color: oklch(0.842 0.038 202.7);
}Tailwind CSS v4
@theme {
--color-clear-water: #afd3d6;
--color-clear-water-50: #e9f9fa;
--color-clear-water-100: #daecee;
--color-clear-water-200: #c2d9dc;
--color-clear-water-300: #a2bdc1;
--color-clear-water-400: #85a6a8;
--color-clear-water-500: #688e91;
--color-clear-water-600: #59787b;
--color-clear-water-700: #476062;
--color-clear-water-800: #334748;
--color-clear-water-900: #233132;
--color-clear-water-950: #121d1e;
}SCSS
$clear-water: #afd3d6;
$clear-water-rgb: 175, 211, 214;
$clear-water-light: mix(#fff, $clear-water, 20%);
$clear-water-dark: mix(#000, $clear-water, 20%);
.element {
color: $clear-water;
box-shadow: 0 0 0 2px rgba($clear-water, 0.35);
}