Colore con nome · #F9DCE3
Marshmallow Heart
Marshmallow Heart è #F9DCE3: rgb(249 220 227), hsl(346 71% 92%), oklch(0.92 0.033 1.4). Scopri tinte, ombre, armonie, contrasto WCAG e APCA e codice CSS, Tailwind v4 e SCSS.
What does Gray mean? → · Marshmallow Heart color name →
#F9DCE3
oklch(0.92 0.033 1.4)
Conversioni di colore
- HEX
- #f9dce3
- RGB
- rgb(249 220 227)
- HSL
- hsl(346 71% 92%)
- HWB
- hwb(346 86% 2%)
- OKLCH
- oklch(0.92 0.033 1.4)
- OKLab
- oklab(0.92 0.033 0.001)
- CIE Lab
- lab(90.34 11.19 0.43)
- LCH
- lch(90.34 11.2 2.2)
- CMYK
- cmyk(0% 12% 9% 2%)
Tinte · Ombre · Toni
Tinte
- FADFE6
- FAE3E9
- FBE6EB
- FCEAEE
- FCEDF1
- FDF1F4
- FDF4F7
- FEF8F9
- FFFBFC
Ombre
- D9BFC5
- B9A3A8
- 9A888C
- 7D6E71
- 615457
- 463C3F
- 2C2627
- 151112
- 030203
Toni
- ECD2D9
- E0C9CE
- D3C0C4
- C7B6BA
- BBADB0
- AFA4A6
- A39B9D
- 979293
- 8B8989
Armonie di colore
Complementare +180°
- F9DCE3
Marshmallow Heart
- CEECE6
≈ Spa
Analogo -30° +30°
- F9DCE3
Marshmallow Heart
- F3DDEF
≈ Divine Dove
- FADDD7
≈ Pink Parfait
Triadico +120° +240°
- F9DCE3
Marshmallow Heart
- E1E9D0
≈ Light Security
- D2E8F9
≈ Freezing Vapour
Complementare divisa +150° +210°
- F9DCE3
Marshmallow Heart
- D5EBDA
≈ Light Katsura
- CCEBF1
≈ Summer Mist
Tetradico +90° +180° +270°
- F9DCE3
Marshmallow Heart
- EDE4CC
≈ Hidden Diary
- CEECE6
≈ Spa
- DCE4FC
≈ Lavender Mist
Contrasto e accessibilità
Ag
FailSu bianco
WCAG 1.28:1 · APCA Lc 14
Ag
AAASu nero
WCAG 16.37:1 · APCA Lc 90
Miglior colore del testo: #000000
WCAG 16.37:1 (AAA) · APCA Lc 90
Contrast pairs
Frammenti di codice
CSS
:root {
--marshmallow-heart: #f9dce3;
--marshmallow-heart-rgb: 249 220 227;
--marshmallow-heart-oklch: oklch(0.92 0.033 1.4);
}
.element {
color: var(--marshmallow-heart);
background-color: hsl(346 71% 92%);
border-color: oklch(0.92 0.033 1.4);
}Tailwind CSS v4
@theme {
--color-marshmallow-heart: #f9dce3;
--color-marshmallow-heart-50: #fef1f4;
--color-marshmallow-heart-100: #f2e4e7;
--color-marshmallow-heart-200: #e2cfd3;
--color-marshmallow-heart-300: #c7b1b5;
--color-marshmallow-heart-400: #b0979d;
--color-marshmallow-heart-500: #9a7d85;
--color-marshmallow-heart-600: #826a70;
--color-marshmallow-heart-700: #68555a;
--color-marshmallow-heart-800: #4d3e42;
--color-marshmallow-heart-900: #352a2d;
--color-marshmallow-heart-950: #20181a;
}SCSS
$marshmallow-heart: #f9dce3;
$marshmallow-heart-rgb: 249, 220, 227;
$marshmallow-heart-light: mix(#fff, $marshmallow-heart, 20%);
$marshmallow-heart-dark: mix(#000, $marshmallow-heart, 20%);
.element {
color: $marshmallow-heart;
box-shadow: 0 0 0 2px rgba($marshmallow-heart, 0.35);
}