Colore con nome · #D04A70
Pink Punch
Pink Punch è #D04A70: rgb(208 74 112), hsl(343 59% 55%), oklch(0.602 0.171 6.5). Scopri tinte, ombre, armonie, contrasto WCAG e APCA e codice CSS, Tailwind v4 e SCSS.
What does Red mean? → · Pink Punch color name →
#D04A70
oklch(0.602 0.171 6.5)
Conversioni di colore
- HEX
- #d04a70
- RGB
- rgb(208 74 112)
- HSL
- hsl(343 59% 55%)
- HWB
- hwb(343 29% 18%)
- OKLCH
- oklch(0.602 0.171 6.5)
- OKLab
- oklab(0.602 0.17 0.019)
- CIE Lab
- lab(51.75 55.78 8.48)
- LCH
- lch(51.75 56.42 8.6)
- CMYK
- cmyk(0% 64% 46% 18%)
Tinte · Ombre · Toni
Tinte
- D75E7D
- DE718B
- E48499
- E996A7
- EEA7B5
- F3B9C3
- F7CAD2
- FADCE1
- FDEDF0
Ombre
- B53F60
- 9A3551
- 802A43
- 672035
- 4F1727
- 390E1A
- 23060E
- 100204
- 020001
Toni
- C95272
- C25973
- BB5F75
- B46576
- AC6A78
- A46F7A
- 9C747B
- 93787D
- 8A7C7E
Armonie di colore
Complementare +180°
- D04A70
Pink Punch
- 00958B
≈ Lights at Sea
Analogo -30° +30°
- D04A70
Pink Punch
- BD51A6
≈ Mazzy Star
- D2512C
≈ Dizzy Days
Triadico +120° +240°
- D04A70
Pink Punch
- 699000
≈ Canopy
- 0086D8
≈ Blue Cola
Complementare divisa +150° +210°
- D04A70
Pink Punch
- 00995B
≈ Militant Vegan
- 0090AA
≈ Zeftron
Tetradico +90° +180° +270°
- D04A70
Pink Punch
- 968000
≈ Thicket Green
- 00958B
≈ Lights at Sea
- 6972E4
≈ Pan Purple
Contrasto e accessibilità
Ag
FailSu bianco
WCAG 4.28:1 · APCA Lc 69
Ag
AASu nero
WCAG 4.89:1 · APCA Lc 33
Miglior colore del testo: #000000
WCAG 4.89:1 (AA) · APCA Lc 33
Contrast pairs
Frammenti di codice
CSS
:root {
--pink-punch: #d04a70;
--pink-punch-rgb: 208 74 112;
--pink-punch-oklch: oklch(0.602 0.171 6.5);
}
.element {
color: var(--pink-punch);
background-color: hsl(343 59% 55%);
border-color: oklch(0.602 0.171 6.5);
}Tailwind CSS v4
@theme {
--color-pink-punch: #d04a70;
--color-pink-punch-50: #ffe2eb;
--color-pink-punch-100: #ffd1dc;
--color-pink-punch-200: #ffb5c6;
--color-pink-punch-300: #ff90a6;
--color-pink-punch-400: #ef6d8e;
--color-pink-punch-500: #dd4774;
--color-pink-punch-600: #bb3e62;
--color-pink-punch-700: #96314e;
--color-pink-punch-800: #70223b;
--color-pink-punch-900: #4f1728;
--color-pink-punch-950: #340716;
}SCSS
$pink-punch: #d04a70;
$pink-punch-rgb: 208, 74, 112;
$pink-punch-light: mix(#fff, $pink-punch, 20%);
$pink-punch-dark: mix(#000, $pink-punch, 20%);
.element {
color: $pink-punch;
box-shadow: 0 0 0 2px rgba($pink-punch, 0.35);
}