命名颜色 · #EFD2D0
Marshmallow Magic
Marshmallow Magic 即 #EFD2D0：rgb(239 210 208)、hsl(4 49% 88%)、oklch(0.887 0.033 22.5)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。
What does Gray mean? → · Marshmallow Magic color name →
#EFD2D0
oklch(0.887 0.033 22.5)
颜色转换
- HEX
- #efd2d0
- RGB
- rgb(239 210 208)
- HSL
- hsl(4 49% 88%)
- HWB
- hwb(4 82% 6%)
- OKLCH
- oklch(0.887 0.033 22.5)
- OKLab
- oklab(0.887 0.03 0.012)
- CIE Lab
- lab(86.62 10.2 4.91)
- LCH
- lch(86.62 11.32 25.7)
- CMYK
- cmyk(0% 12% 13% 6%)
浅色调 · 深色调 · 灰色调
浅色调
- F1D6D5
- F2DBD9
- F4DFDE
- F6E4E3
- F7E8E7
- F9EDEC
- FAF1F1
- FCF6F5
- FEFAFA
深色调
- D0B6B5
- B19B9A
- 948180
- 786867
- 5C504F
- 423939
- 2A2423
- 141010
- 030202
灰色调
- E3C9C8
- D8C1BF
- CDB9B7
- C1B0AF
- B6A8A7
- ABA09F
- A09897
- 95908F
- 8B8888
配色和谐
互补色 +180°
- EFD2D0
Marshmallow Magic
- C2E1E3
≈ Right as Rain
类似色 -30° +30°
- EFD2D0
Marshmallow Magic
- ECD2DC
≈ Distant Flare
- ECD5C7
≈ Blush Beige
三角配色 +120° +240°
- EFD2D0
Marshmallow Magic
- CEE0CC
≈ Endive
- CEDAF0
≈ Hawkes Blue
分裂互补色 +150° +210°
- EFD2D0
Marshmallow Magic
- C5E1D7
≈ Ulthuan Grey
- C5DEEC
≈ Empress Lila
四角配色 +90° +180° +270°
- EFD2D0
Marshmallow Magic
- DADDC4
≈ Planet Earth
- C2E1E3
≈ Right as Rain
- DAD6EE
≈ Lavender Sky
对比度与无障碍
Ag
Fail白底
WCAG 1.41:1 · APCA Lc 20
Ag
AAA黑底
WCAG 14.79:1 · APCA Lc 83
最佳文字颜色: #000000
WCAG 14.79:1 (AAA) · APCA Lc 83
Contrast pairs
代码片段
CSS
:root {
--marshmallow-magic: #efd2d0;
--marshmallow-magic-rgb: 239 210 208;
--marshmallow-magic-oklch: oklch(0.887 0.033 22.5);
}
.element {
color: var(--marshmallow-magic);
background-color: hsl(4 49% 88%);
border-color: oklch(0.887 0.033 22.5);
}Tailwind CSS v4
@theme {
--color-marshmallow-magic: #efd2d0;
--color-marshmallow-magic-50: #fef2f0;
--color-marshmallow-magic-100: #f3e4e2;
--color-marshmallow-magic-200: #e2cfcd;
--color-marshmallow-magic-300: #c8b1af;
--color-marshmallow-magic-400: #b19796;
--color-marshmallow-magic-500: #9b7e7c;
--color-marshmallow-magic-600: #836b69;
--color-marshmallow-magic-700: #695554;
--color-marshmallow-magic-800: #4d3e3e;
--color-marshmallow-magic-900: #362b2a;
--color-marshmallow-magic-950: #211818;
}SCSS
$marshmallow-magic: #efd2d0;
$marshmallow-magic-rgb: 239, 210, 208;
$marshmallow-magic-light: mix(#fff, $marshmallow-magic, 20%);
$marshmallow-magic-dark: mix(#000, $marshmallow-magic, 20%);
.element {
color: $marshmallow-magic;
box-shadow: 0 0 0 2px rgba($marshmallow-magic, 0.35);
}