이름 색상 · #FF85FF
Bubblegum
Bubblegum은(는) #FF85FF: rgb(255 133 255), hsl(300 100% 76%), oklch(0.794 0.207 327.3). 틴트, 셰이드, 색 조화, WCAG·APCA 대비, CSS·Tailwind v4·SCSS 코드를 확인하세요.
What does Purple mean? → · Bubblegum color name →
#FF85FF
oklch(0.794 0.207 327.3)
색상 변환
- HEX
- #ff85ff
- RGB
- rgb(255 133 255)
- HSL
- hsl(300 100% 76%)
- HWB
- hwb(300 52% 0%)
- OKLCH
- oklch(0.794 0.207 327.3)
- OKLab
- oklab(0.794 0.174 -0.112)
- CIE Lab
- lab(72.97 59.23 -40.4)
- LCH
- lch(72.97 71.69 325.7)
- CMYK
- cmyk(0% 48% 0% 0%)
틴트 · 셰이드 · 톤
틴트
- FF93FF
- FFA0FF
- FFADFF
- FFB9FF
- FFC5FF
- FFD1FF
- FFDDFF
- FFE8FF
- FFF4FF
셰이드
- DE73DE
- BE61BE
- 9E509E
- 804080
- 633063
- 482148
- 2E132E
- 160616
- 030103
톤
- F286F2
- E687E5
- D987D8
- CC87CB
- C086BF
- B386B2
- A785A5
- 9A8399
- 8D828C
색 조화
보색 +180°
- FF85FF
Bubblegum
- 42DE66
≈ Hello Spring
유사색 -30° +30°
- FF85FF
Bubblegum
- C4ABFF
≈ Purple Hepatica
- FF96BC
≈ Saira Red
삼각 배색 +120° +240°
- FF85FF
Bubblegum
- E8B300
≈ Trumpet Gold
- 00D3E8
≈ Aztec Turquoise
분열 보색 +150° +210°
- FF85FF
Bubblegum
- B4CA00
≈ Chartreuse Spark
- 00DABA
≈ Channel Marker Green
사각 배색 +90° +180° +270°
대비 및 접근성
Ag
Fail흰색 위
WCAG 2.08:1 · APCA Lc 40
Ag
AAA검은색 위
WCAG 10.05:1 · APCA Lc 62
가장 좋은 글자색: #000000
WCAG 10.05:1 (AAA) · APCA Lc 62
Contrast pairs
코드 스니펫
CSS
:root {
--bubblegum: #ff85ff;
--bubblegum-rgb: 255 133 255;
--bubblegum-oklch: oklch(0.794 0.207 327.3);
}
.element {
color: var(--bubblegum);
background-color: hsl(300 100% 76%);
border-color: oklch(0.794 0.207 327.3);
}Tailwind CSS v4
@theme {
--color-bubblegum: #ff85ff;
--color-bubblegum-50: #ffe1ff;
--color-bubblegum-100: #ffcfff;
--color-bubblegum-200: #ffb4ff;
--color-bubblegum-300: #f08eea;
--color-bubblegum-400: #dc6bdc;
--color-bubblegum-500: #c942cb;
--color-bubblegum-600: #aa3aab;
--color-bubblegum-700: #882e89;
--color-bubblegum-800: #642068;
--color-bubblegum-900: #461649;
--color-bubblegum-950: #2d0630;
}SCSS
$bubblegum: #ff85ff;
$bubblegum-rgb: 255, 133, 255;
$bubblegum-light: mix(#fff, $bubblegum, 20%);
$bubblegum-dark: mix(#000, $bubblegum, 20%);
.element {
color: $bubblegum;
box-shadow: 0 0 0 2px rgba($bubblegum, 0.35);
}