이름 색상 · #ECCBA0
Cream Snap
Cream Snap은(는) #ECCBA0: rgb(236 203 160), hsl(34 67% 78%), oklch(0.86 0.068 74). 틴트, 셰이드, 색 조화, WCAG·APCA 대비, CSS·Tailwind v4·SCSS 코드를 확인하세요.
What does Orange mean? → · Cream Snap color name →
#ECCBA0
oklch(0.86 0.068 74)
색상 변환
- HEX
- #eccba0
- RGB
- rgb(236 203 160)
- HSL
- hsl(34 67% 78%)
- HWB
- hwb(34 63% 7%)
- OKLCH
- oklch(0.86 0.068 74)
- OKLab
- oklab(0.86 0.019 0.065)
- CIE Lab
- lab(83.76 7.52 26.05)
- LCH
- lch(83.76 27.11 73.9)
- CMYK
- cmyk(0% 14% 32% 7%)
틴트 · 셰이드 · 톤
틴트
- EED0AA
- F0D5B3
- F2DBBD
- F4E0C6
- F6E5D0
- F8EAD9
- FAEFE3
- FBF5EC
- FDFAF6
셰이드
- CDB08B
- AF9676
- 927D61
- 76654E
- 5B4D3B
- 423729
- 292219
- 130F09
- 030201
톤
- E1C39D
- D6BC9A
- CBB497
- C0AC94
- B5A591
- AA9D8D
- 9F968A
- 958F87
- 8A8783
색 조화
보색 +180°
- ECCBA0
Cream Snap
- B3D4FD
≈ Ice Cold Stare
유사색 -30° +30°
- ECCBA0
Cream Snap
- F8C3AD
≈ Coral Bisque
- D8D4A0
≈ Garden Glade
삼각 배색 +120° +240°
- ECCBA0
Cream Snap
- 9CDFDE
≈ Pale Pastel
- E1C4F1
≈ Prom Corsage
분열 보색 +150° +210°
- ECCBA0
Cream Snap
- A1DBF2
≈ Sora Blue
- CBCCFD
≈ Lavender Blue
사각 배색 +90° +180° +270°
- ECCBA0
Cream Snap
- A8E0C5
≈ Mountain Mint
- B3D4FD
≈ Ice Cold Stare
- F2C0DC
≈ Rosy Nectar
대비 및 접근성
Ag
Fail흰색 위
WCAG 1.54:1 · APCA Lc 25
Ag
AAA검은색 위
WCAG 13.61:1 · APCA Lc 78
가장 좋은 글자색: #000000
WCAG 13.61:1 (AAA) · APCA Lc 78
Contrast pairs
코드 스니펫
CSS
:root {
--cream-snap: #eccba0;
--cream-snap-rgb: 236 203 160;
--cream-snap-oklch: oklch(0.86 0.068 74);
}
.element {
color: var(--cream-snap);
background-color: hsl(34 67% 78%);
border-color: oklch(0.86 0.068 74);
}Tailwind CSS v4
@theme {
--color-cream-snap: #eccba0;
--color-cream-snap-50: #fff3e0;
--color-cream-snap-100: #f5e5cf;
--color-cream-snap-200: #e5d1b5;
--color-cream-snap-300: #ccb391;
--color-cream-snap-400: #b79972;
--color-cream-snap-500: #a18052;
--color-cream-snap-600: #886c46;
--color-cream-snap-700: #6d5638;
--color-cream-snap-800: #513f28;
--color-cream-snap-900: #382b1a;
--color-cream-snap-950: #23180b;
}SCSS
$cream-snap: #eccba0;
$cream-snap-rgb: 236, 203, 160;
$cream-snap-light: mix(#fff, $cream-snap, 20%);
$cream-snap-dark: mix(#000, $cream-snap, 20%);
.element {
color: $cream-snap;
box-shadow: 0 0 0 2px rgba($cream-snap, 0.35);
}