Colore con nome · #FFDEE2
Sweet Mallow
Sweet Mallow è #FFDEE2: rgb(255 222 226), hsl(353 100% 94%), oklch(0.929 0.037 9.5). Scopri tinte, ombre, armonie, contrasto WCAG e APCA e codice CSS, Tailwind v4 e SCSS.
What does Pink mean? → · Sweet Mallow color name →
#FFDEE2
oklch(0.929 0.037 9.5)
Conversioni di colore
- HEX
- #ffdee2
- RGB
- rgb(255 222 226)
- HSL
- hsl(353 100% 94%)
- HWB
- hwb(353 87% 0%)
- OKLCH
- oklch(0.929 0.037 9.5)
- OKLab
- oklab(0.929 0.036 0.006)
- CIE Lab
- lab(91.34 12.24 2.46)
- LCH
- lch(91.34 12.49 11.4)
- CMYK
- cmyk(0% 13% 11% 0%)
Tinte · Ombre · Toni
Tinte
- FFE1E5
- FFE5E8
- FFE8EB
- FFEBEE
- FFEEF0
- FFF2F3
- FFF5F6
- FFF8F9
- FFFCFC
Ombre
- DEC1C4
- BEA5A8
- 9E898C
- 806F71
- 635557
- 483D3E
- 2E2627
- 161212
- 030203
Toni
- F2D4D8
- E5CBCE
- D7C1C4
- CBB7BA
- BEAEB0
- B1A5A6
- A59B9C
- 989293
- 8C8989
Armonie di colore
Complementare +180°
- FFDEE2
Sweet Mallow
- CDF0ED
≈ Princess Blue Feather
Analogo -30° +30°
- FFDEE2
Sweet Mallow
- F9DFF0
≈ Pale Blossom
- FFE0D6
≈ Light Shell Tint
Triadico +120° +240°
- FFDEE2
Sweet Mallow
- E0EDD3
≈ Spring Wheat
- D6EAFF
≈ Veiling Waterfalls
Complementare divisa +150° +210°
- FFDEE2
Sweet Mallow
- D4F0DF
≈ Pastel Jade
- CEEEF9
≈ Blue Hijab
Tetradico +90° +180° +270°
- FFDEE2
Sweet Mallow
- EDE9CD
≈ Garlic Head
- CDF0ED
≈ Princess Blue Feather
- E2E6FF
≈ Lavender Mist
Contrasto e accessibilità
Ag
FailSu bianco
WCAG 1.25:1 · APCA Lc 12
Ag
AAASu nero
WCAG 16.79:1 · APCA Lc 92
Miglior colore del testo: #000000
WCAG 16.79:1 (AAA) · APCA Lc 92
Contrast pairs
Frammenti di codice
CSS
:root {
--sweet-mallow: #ffdee2;
--sweet-mallow-rgb: 255 222 226;
--sweet-mallow-oklch: oklch(0.929 0.037 9.5);
}
.element {
color: var(--sweet-mallow);
background-color: hsl(353 100% 94%);
border-color: oklch(0.929 0.037 9.5);
}Tailwind CSS v4
@theme {
--color-sweet-mallow: #ffdee2;
--color-sweet-mallow-50: #fff1f2;
--color-sweet-mallow-100: #f4e3e5;
--color-sweet-mallow-200: #e3ced0;
--color-sweet-mallow-300: #c9b0b2;
--color-sweet-mallow-400: #b3969a;
--color-sweet-mallow-500: #9d7c81;
--color-sweet-mallow-600: #85696d;
--color-sweet-mallow-700: #6a5457;
--color-sweet-mallow-800: #4e3d40;
--color-sweet-mallow-900: #362a2c;
--color-sweet-mallow-950: #211819;
}SCSS
$sweet-mallow: #ffdee2;
$sweet-mallow-rgb: 255, 222, 226;
$sweet-mallow-light: mix(#fff, $sweet-mallow, 20%);
$sweet-mallow-dark: mix(#000, $sweet-mallow, 20%);
.element {
color: $sweet-mallow;
box-shadow: 0 0 0 2px rgba($sweet-mallow, 0.35);
}