이름 색상 · #DD77DD
Hibiscus Pop
Hibiscus Pop은(는) #DD77DD: rgb(221 119 221), hsl(300 60% 67%), oklch(0.719 0.178 327.2). 틴트, 셰이드, 색 조화, WCAG·APCA 대비, CSS·Tailwind v4·SCSS 코드를 확인하세요.
What does Purple mean? → · Hibiscus Pop color name →
#DD77DD
oklch(0.719 0.178 327.2)
색상 변환
- HEX
- #dd77dd
- RGB
- rgb(221 119 221)
- HSL
- hsl(300 60% 67%)
- HWB
- hwb(300 47% 13%)
- OKLCH
- oklch(0.719 0.178 327.2)
- OKLab
- oklab(0.719 0.15 -0.096)
- CIE Lab
- lab(64.72 51.01 -34.93)
- LCH
- lch(64.72 61.82 325.6)
- CMYK
- cmyk(0% 46% 0% 13%)
틴트 · 셰이드 · 톤
틴트
- E186E1
- E694E5
- EAA2E8
- EDAFEC
- F1BDEF
- F4CAF3
- F7D7F6
- FAE5F9
- FDF2FC
셰이드
- C067C0
- A457A4
- 884788
- 6E386E
- 552A55
- 3D1C3D
- 261026
- 110511
- 020102
톤
- D479D4
- CB7BCA
- C27CC1
- B97EB8
- AF7FAE
- A67FA5
- 9D809C
- 938093
- 8A8089
색 조화
보색 +180°
- DD77DD
Hibiscus Pop
- 43C15D
≈ Algal Fuel
유사색 -30° +30°
- DD77DD
Hibiscus Pop
- B18AFF
≈ Lilac Geode
- F86DA5
≈ Crazy Pink
삼각 배색 +120° +240°
- DD77DD
Hibiscus Pop
- CB9D00
≈ Molten Bronze
- 00B9CB
≈ Utopia Beckons
분열 보색 +150° +210°
- DD77DD
Hibiscus Pop
- 9DB000
≈ Marker Green
- 00BFA3
≈ First Post
사각 배색 +90° +180° +270°
- DD77DD
Hibiscus Pop
- F28300
≈ Mikan Orange
- 43C15D
≈ Algal Fuel
- 00B0FA
≈ Democrat
대비 및 접근성
Ag
Fail흰색 위
WCAG 2.70:1 · APCA Lc 52
Ag
AAA검은색 위
WCAG 7.75:1 · APCA Lc 50
가장 좋은 글자색: #000000
WCAG 7.75:1 (AAA) · APCA Lc 50
Contrast pairs
코드 스니펫
CSS
:root {
--hibiscus-pop: #dd77dd;
--hibiscus-pop-rgb: 221 119 221;
--hibiscus-pop-oklch: oklch(0.719 0.178 327.2);
}
.element {
color: var(--hibiscus-pop);
background-color: hsl(300 60% 67%);
border-color: oklch(0.719 0.178 327.2);
}Tailwind CSS v4
@theme {
--color-hibiscus-pop: #dd77dd;
--color-hibiscus-pop-50: #ffe4ff;
--color-hibiscus-pop-100: #ffd3ff;
--color-hibiscus-pop-200: #ffb9fa;
--color-hibiscus-pop-300: #e995e4;
--color-hibiscus-pop-400: #d474d4;
--color-hibiscus-pop-500: #c151c2;
--color-hibiscus-pop-600: #a346a4;
--color-hibiscus-pop-700: #833883;
--color-hibiscus-pop-800: #602863;
--color-hibiscus-pop-900: #431b46;
--color-hibiscus-pop-950: #2b0a2d;
}SCSS
$hibiscus-pop: #dd77dd;
$hibiscus-pop-rgb: 221, 119, 221;
$hibiscus-pop-light: mix(#fff, $hibiscus-pop, 20%);
$hibiscus-pop-dark: mix(#000, $hibiscus-pop, 20%);
.element {
color: $hibiscus-pop;
box-shadow: 0 0 0 2px rgba($hibiscus-pop, 0.35);
}