이름 색상 · #EFE0D4
Toasted Marshmallow
Toasted Marshmallow은(는) #EFE0D4: rgb(239 224 212), hsl(27 46% 88%), oklch(0.915 0.023 61.2). 틴트, 셰이드, 색 조화, WCAG·APCA 대비, CSS·Tailwind v4·SCSS 코드를 확인하세요.
What does Gray mean? → · Toasted Marshmallow color name →
#EFE0D4
oklch(0.915 0.023 61.2)
색상 변환
- HEX
- #efe0d4
- RGB
- rgb(239 224 212)
- HSL
- hsl(27 46% 88%)
- HWB
- hwb(27 83% 6%)
- OKLCH
- oklch(0.915 0.023 61.2)
- OKLab
- oklab(0.915 0.011 0.02)
- CIE Lab
- lab(90.15 3.83 7.83)
- LCH
- lch(90.15 8.72 63.9)
- CMYK
- cmyk(0% 6% 11% 6%)
틴트 · 셰이드 · 톤
틴트
- F1E3D8
- F2E6DD
- F4E9E1
- F5ECE5
- F7EFE9
- F9F3EE
- FAF6F2
- FCF9F6
- FDFCFB
셰이드
- D0C3B8
- B1A69D
- 948A83
- 787069
- 5C5651
- 423E3A
- 2A2724
- 141210
- 030202
톤
- E3D6CB
- D8CCC3
- CCC2BA
- C1B8B2
- B6AFA9
- ABA5A1
- A09C98
- 959290
- 8B8988
색 조화
보색 +180°
- EFE0D4
Toasted Marshmallow
- D6E5F1
≈ Snowdrift Glow
유사색 -30° +30°
- EFE0D4
Toasted Marshmallow
- F2DEDA
≈ Pink Chablis
- E9E3D2
≈ Alabaster Beauty
삼각 배색 +120° +240°
- EFE0D4
Toasted Marshmallow
- D3E8E4
≈ Plateau
- E5E0F0
≈ Romantic Cruise
분열 보색 +150° +210°
- EFE0D4
Toasted Marshmallow
- D3E8EC
≈ Coastal Mist
- DDE3F3
≈ Iris Ice
사각 배색 +90° +180° +270°
- EFE0D4
Toasted Marshmallow
- D9E8DB
≈ Bath
- D6E5F1
≈ Snowdrift Glow
- EDDEEA
≈ Angora Pink
대비 및 접근성
Ag
Fail흰색 위
WCAG 1.28:1 · APCA Lc 14
Ag
AAA검은색 위
WCAG 16.28:1 · APCA Lc 89
가장 좋은 글자색: #000000
WCAG 16.28:1 (AAA) · APCA Lc 89
Contrast pairs
코드 스니펫
CSS
:root {
--toasted-marshmallow: #efe0d4;
--toasted-marshmallow-rgb: 239 224 212;
--toasted-marshmallow-oklch: oklch(0.915 0.023 61.2);
}
.element {
color: var(--toasted-marshmallow);
background-color: hsl(27 46% 88%);
border-color: oklch(0.915 0.023 61.2);
}Tailwind CSS v4
@theme {
--color-toasted-marshmallow: #efe0d4;
--color-toasted-marshmallow-50: #faf4ee;
--color-toasted-marshmallow-100: #eee6e0;
--color-toasted-marshmallow-200: #dcd2ca;
--color-toasted-marshmallow-300: #c0b5ac;
--color-toasted-marshmallow-400: #a99c91;
--color-toasted-marshmallow-500: #928377;
--color-toasted-marshmallow-600: #7b6f65;
--color-toasted-marshmallow-700: #635951;
--color-toasted-marshmallow-800: #49413b;
--color-toasted-marshmallow-900: #322d28;
--color-toasted-marshmallow-950: #1e1a16;
}SCSS
$toasted-marshmallow: #efe0d4;
$toasted-marshmallow-rgb: 239, 224, 212;
$toasted-marshmallow-light: mix(#fff, $toasted-marshmallow, 20%);
$toasted-marshmallow-dark: mix(#000, $toasted-marshmallow, 20%);
.element {
color: $toasted-marshmallow;
box-shadow: 0 0 0 2px rgba($toasted-marshmallow, 0.35);
}