Nearest named color · #C5C4FF
#C5C4FF
Nearest named color: Innocent Snowdrop
#C5C4FF (rgb(197 196 255), hsl(241 100% 88%), oklch(0.841 0.082 285.3)) is closest to the named color Innocent Snowdrop. See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
#C5C4FF
oklch(0.841 0.082 285.3)
Color conversions
- 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%)
Tints · Shades · Tones
Tints
- CBCAFF
- D0D0FF
- D6D6FF
- DCDCFF
- E1E2FF
- E7E7FF
- EDEDFF
- F3F3FF
- F9F9FF
Shades
- ABAADE
- 9291BE
- 79789E
- 616180
- 4B4A63
- 353548
- 21212E
- 0E0E16
- 020203
Tones
- BEBDF2
- B7B6E5
- B0AFD8
- A9A8CB
- A2A2BE
- 9B9BB1
- 9494A5
- 8D8D99
- 87878C
Color harmonies
Complementary +180°
- C5C4FF
Innocent Snowdrop
- D2CF90
≈ Lemon Fennel
Analogous -30° +30°
- C5C4FF
Innocent Snowdrop
- A8CEFF
≈ Night Snow
- E0BBF0
≈ Beefy Pink
Triadic +120° +240°
- C5C4FF
Innocent Snowdrop
- F9BB9F
≈ Pallid Orange
- 97DCBE
≈ Green Jewel
Split-complementary +150° +210°
- C5C4FF
Innocent Snowdrop
- EBC48F
≈ Harvester
- B4D8A2
≈ Apple Cream
Tetradic +90° +180° +270°
- C5C4FF
Innocent Snowdrop
- FCB6B9
≈ Ballerina Pink
- D2CF90
≈ Lemon Fennel
- 88DCDC
≈ Cold Blue
Contrast & accessibility
Ag
FailOn white
WCAG 1.65:1 · APCA Lc 29
Ag
AAAOn black
WCAG 12.71:1 · APCA Lc 74
Best text color: #000000
WCAG 12.71:1 (AAA) · APCA Lc 74
Contrast pairs
Code snippets
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);
}