Benannte Farbe · #FF1177
Pucker Up
Pucker Up ist #FF1177: rgb(255 17 119), hsl(334 100% 53%), oklch(0.646 0.254 5.7). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Red mean? → · Pucker Up color name →
#FF1177
oklch(0.646 0.254 5.7)
Farbumrechnungen
- 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%)
Tints · Shades · Tones
Tints
- FF4384
- FF6091
- FF779E
- FF8DAB
- FFA1B9
- FFB5C7
- FFC8D4
- FFDAE2
- FFEDF1
Shades
- DE0D67
- BE0957
- 9E0647
- 800438
- 63022A
- 48011C
- 2E0010
- 160005
- 030001
Tones
- F43278
- E94479
- DD507A
- D15B7B
- C5637C
- B96A7D
- AC717D
- 9E777E
- 907C7F
Farbharmonien
Komplementär +180°
- FF1177
Pucker Up
- 00A498
≈ Tyrolite Blue-Green
Analog -30° +30°
- FF1177
Pucker Up
- E433C8
≈ Kriss Me Not Fuchsia
- F74400
≈ Chéng Hóng Sè Orange
Triadisch +120° +240°
- FF1177
Pucker Up
- 769E00
≈ Luminescent Green
- 0094EB
≈ Pervenche
Geteilt komplementär +150° +210°
- FF1177
Pucker Up
- 00A963
≈ Greedo Green
- 009FBA
≈ Greek Blue
Tetradisch +90° +180° +270°
Kontrast & Barrierefreiheit
Ag
FailAuf Weiß
WCAG 3.75:1 · APCA Lc 63
Ag
AAAuf Schwarz
WCAG 5.59:1 · APCA Lc 39
Beste Textfarbe: #000000
WCAG 5.59:1 (AA) · APCA Lc 39
Contrast pairs
Code-Snippets
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);
}