이름 색상 · #E0D0C2
Cappuccino Foam
Cappuccino Foam은(는) #E0D0C2: rgb(224 208 194), hsl(28 33% 82%), oklch(0.867 0.026 63.7). 틴트, 셰이드, 색 조화, WCAG·APCA 대비, CSS·Tailwind v4·SCSS 코드를 확인하세요.
What does Gray mean? → · Cappuccino Foam color name →
#E0D0C2
oklch(0.867 0.026 63.7)
색상 변환
- HEX
- #e0d0c2
- RGB
- rgb(224 208 194)
- HSL
- hsl(28 33% 82%)
- HWB
- hwb(28 76% 12%)
- OKLCH
- oklch(0.867 0.026 63.7)
- OKLab
- oklab(0.867 0.012 0.023)
- CIE Lab
- lab(84.52 4.03 9.08)
- LCH
- lch(84.52 9.94 66.1)
- CMYK
- cmyk(0% 7% 13% 12%)
틴트 · 셰이드 · 톤
틴트
- E3D5C8
- E6D9CE
- E9DED4
- ECE3DA
- F0E7E0
- F3ECE6
- F6F1EC
- F9F5F3
- FCFAF9
셰이드
- C3B5A8
- A69A8F
- 8A8077
- 706760
- 564F49
- 3E3934
- 272320
- 12100E
- 020202
톤
- D6C8BB
- CCBFB4
- C2B7AE
- B9AFA7
- AFA7A0
- A59F9A
- 9C9793
- 928F8D
- 898886
색 조화
보색 +180°
- E0D0C2
Cappuccino Foam
- C5D6E3
≈ Blue Raindrop
유사색 -30° +30°
- E0D0C2
Cappuccino Foam
- E4CEC8
≈ Ginger Shortbread
- D9D3C0
≈ Pale Lichen
삼각 배색 +120° +240°
- E0D0C2
Cappuccino Foam
- C1D9D5
≈ Meander Blue
- D7CFE2
≈ Mountain’s Majesty
분열 보색 +150° +210°
- E0D0C2
Cappuccino Foam
- C1D8DE
≈ Falling Tears
- CDD2E5
≈ English Channel Fog
사각 배색 +90° +180° +270°
- E0D0C2
Cappuccino Foam
- C7D9CB
≈ Dry Lichen
- C5D6E3
≈ Blue Raindrop
- DECDDA
≈ Cassia Buds
대비 및 접근성
Ag
Fail흰색 위
WCAG 1.50:1 · APCA Lc 24
Ag
AAA검은색 위
WCAG 13.97:1 · APCA Lc 80
가장 좋은 글자색: #000000
WCAG 13.97:1 (AAA) · APCA Lc 80
Contrast pairs
코드 스니펫
CSS
:root {
--cappuccino-foam: #e0d0c2;
--cappuccino-foam-rgb: 224 208 194;
--cappuccino-foam-oklch: oklch(0.867 0.026 63.7);
}
.element {
color: var(--cappuccino-foam);
background-color: hsl(28 33% 82%);
border-color: oklch(0.867 0.026 63.7);
}Tailwind CSS v4
@theme {
--color-cappuccino-foam: #e0d0c2;
--color-cappuccino-foam-50: #fbf4ed;
--color-cappuccino-foam-100: #eee6df;
--color-cappuccino-foam-200: #dcd2c9;
--color-cappuccino-foam-300: #c1b5aa;
--color-cappuccino-foam-400: #aa9c8f;
--color-cappuccino-foam-500: #938375;
--color-cappuccino-foam-600: #7c6f63;
--color-cappuccino-foam-700: #64594f;
--color-cappuccino-foam-800: #494139;
--color-cappuccino-foam-900: #332c27;
--color-cappuccino-foam-950: #1e1a15;
}SCSS
$cappuccino-foam: #e0d0c2;
$cappuccino-foam-rgb: 224, 208, 194;
$cappuccino-foam-light: mix(#fff, $cappuccino-foam, 20%);
$cappuccino-foam-dark: mix(#000, $cappuccino-foam, 20%);
.element {
color: $cappuccino-foam;
box-shadow: 0 0 0 2px rgba($cappuccino-foam, 0.35);
}