이름 색상 · #FF1177
Pucker Up
Pucker Up은(는) #FF1177: rgb(255 17 119), hsl(334 100% 53%), oklch(0.646 0.254 5.7). 틴트, 셰이드, 색 조화, WCAG·APCA 대비, CSS·Tailwind v4·SCSS 코드를 확인하세요.
What does Red mean? → · Pucker Up color name →
#FF1177
oklch(0.646 0.254 5.7)
색상 변환
- HEX
- #ff1177
- RGB
- rgb(255 17 119)
- HSL
- hsl(334 100% 53%)
- HWB
- hwb(334 7% 0%)
- OKLCH
- oklch(0.646 0.254 5.7)
- OKLab
- oklab(0.646 0.253 0.025)
- CIE Lab
- lab(55.86 82.26 11.56)
- LCH
- lch(55.86 83.06 8)
- CMYK
- cmyk(0% 93% 53% 0%)
틴트 · 셰이드 · 톤
틴트
- FF4384
- FF6091
- FF779E
- FF8DAB
- FFA1B9
- FFB5C7
- FFC8D4
- FFDAE2
- FFEDF1
셰이드
- DE0D67
- BE0957
- 9E0647
- 800438
- 63022A
- 48011C
- 2E0010
- 160005
- 030001
톤
- F43278
- E94479
- DD507A
- D15B7B
- C5637C
- B96A7D
- AC717D
- 9E777E
- 907C7F
색 조화
보색 +180°
- FF1177
Pucker Up
- 00A498
≈ Tyrolite Blue-Green
유사색 -30° +30°
- FF1177
Pucker Up
- E433C8
≈ Kriss Me Not Fuchsia
- F74400
≈ Chéng Hóng Sè Orange
삼각 배색 +120° +240°
- FF1177
Pucker Up
- 769E00
≈ Luminescent Green
- 0094EB
≈ Pervenche
분열 보색 +150° +210°
- FF1177
Pucker Up
- 00A963
≈ Greedo Green
- 009FBA
≈ Greek Blue
사각 배색 +90° +180° +270°
대비 및 접근성
Ag
Fail흰색 위
WCAG 3.75:1 · APCA Lc 63
Ag
AA검은색 위
WCAG 5.59:1 · APCA Lc 39
가장 좋은 글자색: #000000
WCAG 5.59:1 (AA) · APCA Lc 39
Contrast pairs
코드 스니펫
CSS
:root {
--pucker-up: #ff1177;
--pucker-up-rgb: 255 17 119;
--pucker-up-oklch: oklch(0.646 0.254 5.7);
}
.element {
color: var(--pucker-up);
background-color: hsl(334 100% 53%);
border-color: oklch(0.646 0.254 5.7);
}Tailwind CSS v4
@theme {
--color-pucker-up: #ff1177;
--color-pucker-up-50: #ffd7e8;
--color-pucker-up-100: #ffc4d8;
--color-pucker-up-200: #ffa3c0;
--color-pucker-up-300: #ff759f;
--color-pucker-up-400: #ff4188;
--color-pucker-up-500: #fe006d;
--color-pucker-up-600: #d7005d;
--color-pucker-up-700: #ad004a;
--color-pucker-up-800: #810039;
--color-pucker-up-900: #5b0027;
--color-pucker-up-950: #3d0015;
}SCSS
$pucker-up: #ff1177;
$pucker-up-rgb: 255, 17, 119;
$pucker-up-light: mix(#fff, $pucker-up, 20%);
$pucker-up-dark: mix(#000, $pucker-up, 20%);
.element {
color: $pucker-up;
box-shadow: 0 0 0 2px rgba($pucker-up, 0.35);
}