이름 색상 · #8A2BE2
Bright Blue Violet
Bright Blue Violet은(는) #8A2BE2: rgb(138 43 226), hsl(271 76% 53%), oklch(0.534 0.25 301.4). 틴트, 셰이드, 색 조화, WCAG·APCA 대비, CSS·Tailwind v4·SCSS 코드를 확인하세요.
What does Purple mean? → · Bright Blue Violet color name →
#8A2BE2
oklch(0.534 0.25 301.4)
색상 변환
- HEX
- #8a2be2
- RGB
- rgb(138 43 226)
- HSL
- hsl(271 76% 53%)
- HWB
- hwb(271 17% 11%)
- OKLCH
- oklch(0.534 0.25 301.4)
- OKLab
- oklab(0.534 0.13 -0.214)
- CIE Lab
- lab(41.21 63.01 -75.96)
- LCH
- lch(41.21 98.69 309.7)
- CMYK
- cmyk(39% 81% 0% 11%)
틴트 · 셰이드 · 톤
틴트
- 944AE7
- 9F62EB
- AA78EF
- B68CF3
- C1A0F6
- CDB3F9
- D9C6FB
- E6D9FD
- F2ECFE
셰이드
- 7724C4
- 651DA8
- 53168C
- 421071
- 320A57
- 22053E
- 140227
- 070112
- 010003
톤
- 893CD9
- 8748D0
- 8652C7
- 855BBD
- 8463B4
- 836AAA
- 8270A0
- 817696
- 817B8B
색 조화
보색 +180°
- 8A2BE2
Bright Blue Violet
- 627700
≈ Topiary Green
유사색 -30° +30°
- 8A2BE2
Bright Blue Violet
- 424EFA
≈ Saturated Sky
- B400AA
≈ Rosolanc Purple
삼각 배색 +120° +240°
- 8A2BE2
Bright Blue Violet
- 9F5900
≈ Sepia Wash
- 007F70
≈ Blue Green
분열 보색 +150° +210°
- 8A2BE2
Bright Blue Violet
- 846A00
≈ Muddy Brown
- 00833F
≈ Warpstone Glow
사각 배색 +90° +180° +270°
- 8A2BE2
Bright Blue Violet
- C81D00
≈ Vampire State Building
- 627700
≈ Topiary Green
- 007B8C
≈ Biscay Bay
대비 및 접근성
Ag
AA흰색 위
WCAG 5.95:1 · APCA Lc 78
Ag
Fail검은색 위
WCAG 3.52:1 · APCA Lc 23
가장 좋은 글자색: #FFFFFF
WCAG 5.95:1 (AA) · APCA Lc 78
Contrast pairs
코드 스니펫
CSS
:root {
--bright-blue-violet: #8a2be2;
--bright-blue-violet-rgb: 138 43 226;
--bright-blue-violet-oklch: oklch(0.534 0.25 301.4);
}
.element {
color: var(--bright-blue-violet);
background-color: hsl(271 76% 53%);
border-color: oklch(0.534 0.25 301.4);
}Tailwind CSS v4
@theme {
--color-bright-blue-violet: #8a2be2;
--color-bright-blue-violet-50: #ffe4ff;
--color-bright-blue-violet-100: #f9d3ff;
--color-bright-blue-violet-200: #ebb8ff;
--color-bright-blue-violet-300: #d392ff;
--color-bright-blue-violet-400: #bb6eff;
--color-bright-blue-violet-500: #a741ff;
--color-bright-blue-violet-600: #8d39e2;
--color-bright-blue-violet-700: #712eb6;
--color-bright-blue-violet-800: #51218a;
--color-bright-blue-violet-900: #391662;
--color-bright-blue-violet-950: #230543;
}SCSS
$bright-blue-violet: #8a2be2;
$bright-blue-violet-rgb: 138, 43, 226;
$bright-blue-violet-light: mix(#fff, $bright-blue-violet, 20%);
$bright-blue-violet-dark: mix(#000, $bright-blue-violet, 20%);
.element {
color: $bright-blue-violet;
box-shadow: 0 0 0 2px rgba($bright-blue-violet, 0.35);
}