Couleur nommée la plus proche · #C5C4FF
#C5C4FF
Couleur nommée la plus proche: Innocent Snowdrop
#C5C4FF (rgb(197 196 255), hsl(241 100% 88%), oklch(0.841 0.082 285.3)) est la plus proche de la couleur nommée Innocent Snowdrop. Teintes, ombres, harmonies, contraste WCAG et APCA, et code CSS, Tailwind v4 et SCSS.
#C5C4FF
oklch(0.841 0.082 285.3)
Conversions de couleur
- HEX
- #c5c4ff
- RGB
- rgb(197 196 255)
- HSL
- hsl(241 100% 88%)
- HWB
- hwb(241 77% 0%)
- OKLCH
- oklch(0.841 0.082 285.3)
- OKLab
- oklab(0.841 0.022 -0.079)
- CIE Lab
- lab(80.77 9.54 -29.06)
- LCH
- lch(80.77 30.59 288.2)
- CMYK
- cmyk(23% 23% 0% 0%)
Teintes · Ombres · Tons
Teintes
- CBCAFF
- D0D0FF
- D6D6FF
- DCDCFF
- E1E2FF
- E7E7FF
- EDEDFF
- F3F3FF
- F9F9FF
Ombres
- ABAADE
- 9291BE
- 79789E
- 616180
- 4B4A63
- 353548
- 21212E
- 0E0E16
- 020203
Tons
- BEBDF2
- B7B6E5
- B0AFD8
- A9A8CB
- A2A2BE
- 9B9BB1
- 9494A5
- 8D8D99
- 87878C
Harmonies de couleurs
Complémentaire +180°
- C5C4FF
Innocent Snowdrop
- D2CF90
≈ Lemon Fennel
Analogue -30° +30°
- C5C4FF
Innocent Snowdrop
- A8CEFF
≈ Night Snow
- E0BBF0
≈ Beefy Pink
Triadique +120° +240°
- C5C4FF
Innocent Snowdrop
- F9BB9F
≈ Pallid Orange
- 97DCBE
≈ Green Jewel
Complémentaire divisée +150° +210°
- C5C4FF
Innocent Snowdrop
- EBC48F
≈ Harvester
- B4D8A2
≈ Apple Cream
Tétradique +90° +180° +270°
- C5C4FF
Innocent Snowdrop
- FCB6B9
≈ Ballerina Pink
- D2CF90
≈ Lemon Fennel
- 88DCDC
≈ Cold Blue
Contraste et accessibilité
Ag
FailSur blanc
WCAG 1.65:1 · APCA Lc 29
Ag
AAASur noir
WCAG 12.71:1 · APCA Lc 74
Meilleure couleur de texte: #000000
WCAG 12.71:1 (AAA) · APCA Lc 74
Contrast pairs
Extraits de code
CSS
:root {
--innocent-snowdrop: #c5c4ff;
--innocent-snowdrop-rgb: 197 196 255;
--innocent-snowdrop-oklch: oklch(0.841 0.082 285.3);
}
.element {
color: var(--innocent-snowdrop);
background-color: hsl(241 100% 88%);
border-color: oklch(0.841 0.082 285.3);
}Tailwind CSS v4
@theme {
--color-innocent-snowdrop: #c5c4ff;
--color-innocent-snowdrop-50: #f3f2ff;
--color-innocent-snowdrop-100: #e5e4ff;
--color-innocent-snowdrop-200: #d1d0f6;
--color-innocent-snowdrop-300: #b4b2e0;
--color-innocent-snowdrop-400: #9998cd;
--color-innocent-snowdrop-500: #817eba;
--color-innocent-snowdrop-600: #6d6b9d;
--color-innocent-snowdrop-700: #57557e;
--color-innocent-snowdrop-800: #3e3f5e;
--color-innocent-snowdrop-900: #2b2b42;
--color-innocent-snowdrop-950: #18182a;
}SCSS
$innocent-snowdrop: #c5c4ff;
$innocent-snowdrop-rgb: 197, 196, 255;
$innocent-snowdrop-light: mix(#fff, $innocent-snowdrop, 20%);
$innocent-snowdrop-dark: mix(#000, $innocent-snowdrop, 20%);
.element {
color: $innocent-snowdrop;
box-shadow: 0 0 0 2px rgba($innocent-snowdrop, 0.35);
}