Couleur nommée · #C4C9E2
Silver Sweetpea
Silver Sweetpea correspond à #C4C9E2 : rgb(196 201 226), hsl(230 34% 83%), oklch(0.84 0.035 276.6). Teintes, ombres, harmonies, contraste WCAG et APCA, et code CSS, Tailwind v4 et SCSS.
What does Blue mean? → · Silver Sweetpea color name →
#C4C9E2
oklch(0.84 0.035 276.6)
Conversions de couleur
- HEX
- #c4c9e2
- RGB
- rgb(196 201 226)
- HSL
- hsl(230 34% 83%)
- HWB
- hwb(230 77% 11%)
- OKLCH
- oklch(0.84 0.035 276.6)
- OKLab
- oklab(0.84 0.004 -0.035)
- CIE Lab
- lab(81.16 1.92 -13.07)
- LCH
- lch(81.16 13.21 278.4)
- CMYK
- cmyk(13% 11% 0% 11%)
Teintes · Ombres · Tons
Teintes
- CACEE5
- D0D4E8
- D5D9EB
- DBDEEE
- E1E4F1
- E7E9F4
- EDEFF6
- F3F4F9
- F9FAFC
Ombres
- AAAEC4
- 9195A8
- 787C8C
- 616471
- 4A4C57
- 35363E
- 212227
- 0E0F12
- 020203
Tons
- BDC1D8
- B6BACE
- AFB3C4
- A8ABBA
- A1A4B0
- 9B9DA6
- 94959C
- 8D8E93
- 878789
Harmonies de couleurs
Complémentaire +180°
- C4C9E2
Silver Sweetpea
- D1CBB1
≈ Platinum Sage
Analogue -30° +30°
- C4C9E2
Silver Sweetpea
- B9CDE1
≈ Impressionist Sky
- D0C5DD
≈ Lavender Bliss
Triadique +120° +240°
- C4C9E2
Silver Sweetpea
- E0C3BB
≈ Golden Guernsey
- B9D2C1
≈ Little Beaux Blue
Complémentaire divisée +150° +210°
- C4C9E2
Silver Sweetpea
- DBC7B3
≈ Playa Arenosa
- C4CFB7
≈ Tender Greens
Tétradique +90° +180° +270°
- C4C9E2
Silver Sweetpea
- E0C2C7
≈ Odyssey Plum
- D1CBB1
≈ Platinum Sage
- B2D2CE
≈ Icy Morn
Contraste et accessibilité
Ag
FailSur blanc
WCAG 1.64:1 · APCA Lc 28
Ag
AAASur noir
WCAG 12.80:1 · APCA Lc 74
Meilleure couleur de texte: #000000
WCAG 12.80:1 (AAA) · APCA Lc 74
Contrast pairs
Extraits de code
CSS
:root {
--silver-sweetpea: #c4c9e2;
--silver-sweetpea-rgb: 196 201 226;
--silver-sweetpea-oklch: oklch(0.84 0.035 276.6);
}
.element {
color: var(--silver-sweetpea);
background-color: hsl(230 34% 83%);
border-color: oklch(0.84 0.035 276.6);
}Tailwind CSS v4
@theme {
--color-silver-sweetpea: #c4c9e2;
--color-silver-sweetpea-50: #f3f4ff;
--color-silver-sweetpea-100: #e5e7f4;
--color-silver-sweetpea-200: #d0d3e4;
--color-silver-sweetpea-300: #b3b6ca;
--color-silver-sweetpea-400: #999db4;
--color-silver-sweetpea-500: #80859e;
--color-silver-sweetpea-600: #6c7086;
--color-silver-sweetpea-700: #565a6b;
--color-silver-sweetpea-800: #3e424f;
--color-silver-sweetpea-900: #2b2d37;
--color-silver-sweetpea-950: #181a22;
}SCSS
$silver-sweetpea: #c4c9e2;
$silver-sweetpea-rgb: 196, 201, 226;
$silver-sweetpea-light: mix(#fff, $silver-sweetpea, 20%);
$silver-sweetpea-dark: mix(#000, $silver-sweetpea, 20%);
.element {
color: $silver-sweetpea;
box-shadow: 0 0 0 2px rgba($silver-sweetpea, 0.35);
}