이름 색상 · #602287
Purplex
Purplex은(는) #602287: rgb(96 34 135), hsl(277 60% 33%), oklch(0.398 0.161 308.8). 틴트, 셰이드, 색 조화, WCAG·APCA 대비, CSS·Tailwind v4·SCSS 코드를 확인하세요.
What does Purple mean? → · Purplex color name →
#602287
oklch(0.398 0.161 308.8)
색상 변환
- HEX
- #602287
- RGB
- rgb(96 34 135)
- HSL
- hsl(277 60% 33%)
- HWB
- hwb(277 13% 47%)
- OKLCH
- oklch(0.398 0.161 308.8)
- OKLab
- oklab(0.398 0.101 -0.126)
- CIE Lab
- lab(27.35 41.49 -44.81)
- LCH
- lch(27.35 61.07 312.8)
- CMYK
- cmyk(29% 75% 0% 47%)
틴트 · 셰이드 · 톤
틴트
- 6F3B94
- 7E51A0
- 8D66AC
- 9D7BB9
- AD91C5
- BDA6D1
- CDBCDC
- DDD2E8
- EEE8F4
셰이드
- 521C75
- 451663
- 381151
- 2C0B41
- 200731
- 150321
- 0A0113
- 030006
- 000001
톤
- 632F87
- 673A87
- 6A4487
- 6D4D87
- 705686
- 735F85
- 776784
- 7A6F83
- 7D7882
색 조화
보색 +180°
- 602287
Purplex
- 355100
≈ Navy Green
유사색 -30° +30°
- 602287
Purplex
- 3A339A
≈ Bluebell
- 790F63
≈ Purple Curse
삼각 배색 +120° +240°
- 602287
Purplex
- 653D00
≈ Bestial Brown
- 00534E
≈ Plankton Green
분열 보색 +150° +210°
- 602287
Purplex
- 524700
≈ Sugarloaf Brown
- 005534
≈ Permanent Green
사각 배색 +90° +180° +270°
대비 및 접근성
Ag
AAA흰색 위
WCAG 10.11:1 · APCA Lc 93
Ag
Fail검은색 위
WCAG 2.07:1 · APCA Lc 10
가장 좋은 글자색: #FFFFFF
WCAG 10.11:1 (AAA) · APCA Lc 93
Contrast pairs
코드 스니펫
CSS
:root {
--purplex: #602287;
--purplex-rgb: 96 34 135;
--purplex-oklch: oklch(0.398 0.161 308.8);
}
.element {
color: var(--purplex);
background-color: hsl(277 60% 33%);
border-color: oklch(0.398 0.161 308.8);
}Tailwind CSS v4
@theme {
--color-purplex: #602287;
--color-purplex-50: #ffe9ff;
--color-purplex-100: #f9d9ff;
--color-purplex-200: #eac1ff;
--color-purplex-300: #d29ff4;
--color-purplex-400: #ba81e6;
--color-purplex-500: #a562d6;
--color-purplex-600: #8b54b4;
--color-purplex-700: #704391;
--color-purplex-800: #51306d;
--color-purplex-900: #38214d;
--color-purplex-950: #231033;
}SCSS
$purplex: #602287;
$purplex-rgb: 96, 34, 135;
$purplex-light: mix(#fff, $purplex, 20%);
$purplex-dark: mix(#000, $purplex, 20%);
.element {
color: $purplex;
box-shadow: 0 0 0 2px rgba($purplex, 0.35);
}