Couleur nommée · #E1BBDB
Sweetie Pie
Sweetie Pie correspond à #E1BBDB : rgb(225 187 219), hsl(309 39% 81%), oklch(0.835 0.061 331.4). Teintes, ombres, harmonies, contraste WCAG et APCA, et code CSS, Tailwind v4 et SCSS.
What does Pink mean? → · Sweetie Pie color name →
#E1BBDB
oklch(0.835 0.061 331.4)
Conversions de couleur
- HEX
- #e1bbdb
- RGB
- rgb(225 187 219)
- HSL
- hsl(309 39% 81%)
- HWB
- hwb(309 73% 12%)
- OKLCH
- oklch(0.835 0.061 331.4)
- OKLab
- oklab(0.835 0.053 -0.029)
- CIE Lab
- lab(79.99 18.03 -10.73)
- LCH
- lch(79.99 20.98 329.2)
- CMYK
- cmyk(0% 17% 3% 12%)
Teintes · Ombres · Tons
Teintes
- E4C2DF
- E7C8E2
- EACFE6
- EDD6E9
- F0DDED
- F3E4F1
- F6EAF4
- F9F1F8
- FCF8FB
Ombres
- C4A2BE
- A78AA2
- 8B7387
- 705C6D
- 564654
- 3E323C
- 271F26
- 120D11
- 020202
Tons
- D7B5D2
- CDAFC8
- C3A9BF
- B9A3B6
- B09DAC
- A697A3
- 9C919A
- 938C92
- 898689
Harmonies de couleurs
Complémentaire +180°
- E1BBDB
Sweetie Pie
- ADD5B5
≈ Enchanted Meadow
Analogue -30° +30°
- E1BBDB
Sweetie Pie
- CFC0EB
≈ York Plum
- ECB9C6
≈ Chantilly
Triadique +120° +240°
- E1BBDB
Sweetie Pie
- D7C89C
≈ Straw Basket
- 9BD4E0
≈ Ocean Cruise
Complémentaire divisée +150° +210°
- E1BBDB
Sweetie Pie
- C2D0A4
≈ Landscape
- 9DD6CB
≈ Aqua Glow
Tétradique +90° +180° +270°
- E1BBDB
Sweetie Pie
- E7C1A1
≈ Peach Latte
- ADD5B5
≈ Enchanted Meadow
- A6CFED
≈ Sail
Contraste et accessibilité
Ag
FailSur blanc
WCAG 1.70:1 · APCA Lc 30
Ag
AAASur noir
WCAG 12.33:1 · APCA Lc 72
Meilleure couleur de texte: #000000
WCAG 12.33:1 (AAA) · APCA Lc 72
Contrast pairs
Extraits de code
CSS
:root {
--sweetie-pie: #e1bbdb;
--sweetie-pie-rgb: 225 187 219;
--sweetie-pie-oklch: oklch(0.835 0.061 331.4);
}
.element {
color: var(--sweetie-pie);
background-color: hsl(309 39% 81%);
border-color: oklch(0.835 0.061 331.4);
}Tailwind CSS v4
@theme {
--color-sweetie-pie: #e1bbdb;
--color-sweetie-pie-50: #ffeffd;
--color-sweetie-pie-100: #f5e1f1;
--color-sweetie-pie-200: #e5cbdf;
--color-sweetie-pie-300: #cbacc5;
--color-sweetie-pie-400: #b492af;
--color-sweetie-pie-500: #9e7899;
--color-sweetie-pie-600: #866581;
--color-sweetie-pie-700: #6b5167;
--color-sweetie-pie-800: #4e3b4d;
--color-sweetie-pie-900: #372835;
--color-sweetie-pie-950: #211620;
}SCSS
$sweetie-pie: #e1bbdb;
$sweetie-pie-rgb: 225, 187, 219;
$sweetie-pie-light: mix(#fff, $sweetie-pie, 20%);
$sweetie-pie-dark: mix(#000, $sweetie-pie, 20%);
.element {
color: $sweetie-pie;
box-shadow: 0 0 0 2px rgba($sweetie-pie, 0.35);
}