이름 색상 · #9E003A
Cranberry
Cranberry은(는) #9E003A: rgb(158 0 58), hsl(338 100% 31%), oklch(0.446 0.178 11.5). 틴트, 셰이드, 색 조화, WCAG·APCA 대비, CSS·Tailwind v4·SCSS 코드를 확인하세요.
What does Red mean? → · Cranberry color name →
#9E003A
oklch(0.446 0.178 11.5)
색상 변환
- HEX
- #9e003a
- RGB
- rgb(158 0 58)
- HSL
- hsl(338 100% 31%)
- HWB
- hwb(338 0% 38%)
- OKLCH
- oklch(0.446 0.178 11.5)
- OKLab
- oklab(0.446 0.175 0.036)
- CIE Lab
- lab(33.7 57.73 15.95)
- LCH
- lch(33.7 59.9 15.4)
- CMYK
- cmyk(0% 100% 63% 38%)
틴트 · 셰이드 · 톤
틴트
- AB2E4C
- B7495E
- C26170
- CD7884
- D78E97
- E0A5AB
- E9BBC0
- F1D1D4
- F8E8E9
셰이드
- 890031
- 740028
- 600020
- 4D0018
- 3A0010
- 290009
- 180004
- 090001
- 010000
톤
- 9D2041
- 9C3048
- 9A3D4F
- 984955
- 96535C
- 935D63
- 8F666B
- 8B6F72
- 867879
색 조화
보색 +180°
- 9E003A
Cranberry
- 00615F
≈ Emerald Stone
유사색 -30° +30°
- 9E003A
Cranberry
- 8F1470
≈ Royal Purpleness
- 8F3200
≈ Red Tone Ink
삼각 배색 +120° +240°
- 9E003A
Cranberry
- 3A6100
≈ Rainforest Matcha
- 00559A
≈ Standing Waters
분열 보색 +150° +210°
- 9E003A
Cranberry
- 006442
≈ Aotake Bamboo
- 005E74
≈ Lyons Blue
사각 배색 +90° +180° +270°
대비 및 접근성
Ag
AAA흰색 위
WCAG 8.35:1 · APCA Lc 86
Ag
Fail검은색 위
WCAG 2.51:1 · APCA Lc 16
가장 좋은 글자색: #FFFFFF
WCAG 8.35:1 (AAA) · APCA Lc 86
Contrast pairs
코드 스니펫
CSS
:root {
--cranberry: #9e003a;
--cranberry-rgb: 158 0 58;
--cranberry-oklch: oklch(0.446 0.178 11.5);
}
.element {
color: var(--cranberry);
background-color: hsl(338 100% 31%);
border-color: oklch(0.446 0.178 11.5);
}Tailwind CSS v4
@theme {
--color-cranberry: #9e003a;
--color-cranberry-50: #ffe1e6;
--color-cranberry-100: #ffd0d6;
--color-cranberry-200: #ffb4be;
--color-cranberry-300: #ff8f9c;
--color-cranberry-400: #f46b83;
--color-cranberry-500: #e24267;
--color-cranberry-600: #bf3a58;
--color-cranberry-700: #9a2e46;
--color-cranberry-800: #722035;
--color-cranberry-900: #511524;
--color-cranberry-950: #350513;
}SCSS
$cranberry: #9e003a;
$cranberry-rgb: 158, 0, 58;
$cranberry-light: mix(#fff, $cranberry, 20%);
$cranberry-dark: mix(#000, $cranberry, 20%);
.element {
color: $cranberry;
box-shadow: 0 0 0 2px rgba($cranberry, 0.35);
}