이름 색상 · #8775A1
Smashed Grape
Smashed Grape은(는) #8775A1: rgb(135 117 161), hsl(265 19% 55%), oklch(0.595 0.069 303.1). 틴트, 셰이드, 색 조화, WCAG·APCA 대비, CSS·Tailwind v4·SCSS 코드를 확인하세요.
What does Purple mean? → · Smashed Grape color name →
#8775A1
oklch(0.595 0.069 303.1)
색상 변환
- HEX
- #8775a1
- RGB
- rgb(135 117 161)
- HSL
- hsl(265 19% 55%)
- HWB
- hwb(265 46% 37%)
- OKLCH
- oklch(0.595 0.069 303.1)
- OKLab
- oklab(0.595 0.038 -0.058)
- CIE Lab
- lab(52.18 14.02 -21.14)
- LCH
- lch(52.18 25.37 303.5)
- CMYK
- cmyk(16% 27% 0% 37%)
틴트 · 셰이드 · 톤
틴트
- 9282AA
- 9E8FB4
- A99DBD
- B5AAC6
- C1B8D0
- CDC6D9
- DAD4E3
- E6E2EC
- F2F1F5
셰이드
- 75658B
- 635576
- 514662
- 41374E
- 31293C
- 211C2A
- 130F19
- 060509
- 010101
톤
- 86769E
- 86779B
- 857997
- 847A94
- 837B91
- 837C8E
- 827D8A
- 817E87
- 817F83
색 조화
보색 +180°
- 8775A1
Smashed Grape
- 778658
≈ Fern Canopy
유사색 -30° +30°
- 8775A1
Smashed Grape
- 717CA8
≈ Lavender Violet
- 987091
≈ Felicia
삼각 배색 +120° +240°
- 8775A1
Smashed Grape
- 9C7653
≈ Dirt
- 4B8C83
≈ Royal Palm
분열 보색 +150° +210°
- 8775A1
Smashed Grape
- 8D7E4E
≈ Fennel Seed
- 5E8B6B
≈ Murdoch
사각 배색 +90° +180° +270°
- 8775A1
Smashed Grape
- A47064
≈ Blast-Off Bronze
- 778658
≈ Fern Canopy
- 4A8A97
≈ Blue Square
대비 및 접근성
Ag
Fail흰색 위
WCAG 4.12:1 · APCA Lc 68
Ag
AA검은색 위
WCAG 5.08:1 · APCA Lc 33
가장 좋은 글자색: #000000
WCAG 5.08:1 (AA) · APCA Lc 33
Contrast pairs
코드 스니펫
CSS
:root {
--smashed-grape: #8775a1;
--smashed-grape-rgb: 135 117 161;
--smashed-grape-oklch: oklch(0.595 0.069 303.1);
}
.element {
color: var(--smashed-grape);
background-color: hsl(265 19% 55%);
border-color: oklch(0.595 0.069 303.1);
}Tailwind CSS v4
@theme {
--color-smashed-grape: #8775a1;
--color-smashed-grape-50: #faf1ff;
--color-smashed-grape-100: #ede3fb;
--color-smashed-grape-200: #dbcdec;
--color-smashed-grape-300: #bfafd4;
--color-smashed-grape-400: #a695c0;
--color-smashed-grape-500: #8f7bac;
--color-smashed-grape-600: #796891;
--color-smashed-grape-700: #615375;
--color-smashed-grape-800: #463d57;
--color-smashed-grape-900: #312a3d;
--color-smashed-grape-950: #1d1726;
}SCSS
$smashed-grape: #8775a1;
$smashed-grape-rgb: 135, 117, 161;
$smashed-grape-light: mix(#fff, $smashed-grape, 20%);
$smashed-grape-dark: mix(#000, $smashed-grape, 20%);
.element {
color: $smashed-grape;
box-shadow: 0 0 0 2px rgba($smashed-grape, 0.35);
}