Benannte Farbe · #D96CAD
Purple Hollyhock
Purple Hollyhock ist #D96CAD: rgb(217 108 173), hsl(324 59% 64%), oklch(0.678 0.155 345.3). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Pink mean? → · Purple Hollyhock color name →
#D96CAD
oklch(0.678 0.155 345.3)
Farbumrechnungen
- HEX
- #d96cad
- RGB
- rgb(217 108 173)
- HSL
- hsl(324 59% 64%)
- HWB
- hwb(324 42% 15%)
- OKLCH
- oklch(0.678 0.155 345.3)
- OKLab
- oklab(0.678 0.15 -0.039)
- CIE Lab
- lab(60.54 49.15 -14.29)
- LCH
- lch(60.54 51.19 343.8)
- CMYK
- cmyk(0% 50% 20% 15%)
Tints · Shades · Tones
Tints
- DE7BB5
- E38ABD
- E899C5
- ECA8CD
- F0B6D6
- F4C5DE
- F7D3E6
- FAE2EE
- FDF0F7
Shades
- BC5D96
- A14E7F
- 86406A
- 6C3255
- 532541
- 3B192D
- 250D1B
- 11040B
- 020001
Tones
- D16FA8
- C872A4
- C0749F
- B7779B
- AE7996
- A67B92
- 9D7C8D
- 937E89
- 8A7F84
Farbharmonien
Komplementär +180°
- D96CAD
Purple Hollyhock
- 00B382
≈ Dark Mountain Meadow
Analog -30° +30°
- D96CAD
Purple Hollyhock
- BC77D8
≈ Lavender Blossom
- E76A78
≈ Old Heart
Triadisch +120° +240°
- D96CAD
Purple Hollyhock
- A59C00
≈ Nuclear Fallout
- 00A7D3
≈ Malibu Blue
Geteilt komplementär +150° +210°
- D96CAD
Purple Hollyhock
- 6BAC42
≈ Leaf
- 00ADAE
≈ Greenland Green
Tetradisch +90° +180° +270°
- D96CAD
Purple Hollyhock
- CA8900
≈ Lobster Butter Sauce
- 00B382
≈ Dark Mountain Meadow
- 5099F5
≈ Polar Glow
Kontrast & Barrierefreiheit
Ag
FailAuf Weiß
WCAG 3.13:1 · APCA Lc 58
Ag
AAAuf Schwarz
WCAG 6.69:1 · APCA Lc 44
Beste Textfarbe: #000000
WCAG 6.69:1 (AA) · APCA Lc 44
Contrast pairs
Code-Snippets
CSS
:root {
--purple-hollyhock: #d96cad;
--purple-hollyhock-rgb: 217 108 173;
--purple-hollyhock-oklch: oklch(0.678 0.155 345.3);
}
.element {
color: var(--purple-hollyhock);
background-color: hsl(324 59% 64%);
border-color: oklch(0.678 0.155 345.3);
}Tailwind CSS v4
@theme {
--color-purple-hollyhock: #d96cad;
--color-purple-hollyhock-50: #ffe4fe;
--color-purple-hollyhock-100: #ffd4f2;
--color-purple-hollyhock-200: #ffb9e1;
--color-purple-hollyhock-300: #f196c6;
--color-purple-hollyhock-400: #de76b3;
--color-purple-hollyhock-500: #ca549d;
--color-purple-hollyhock-600: #ab4885;
--color-purple-hollyhock-700: #89396a;
--color-purple-hollyhock-800: #652950;
--color-purple-hollyhock-900: #471b38;
--color-purple-hollyhock-950: #2e0b22;
}SCSS
$purple-hollyhock: #d96cad;
$purple-hollyhock-rgb: 217, 108, 173;
$purple-hollyhock-light: mix(#fff, $purple-hollyhock, 20%);
$purple-hollyhock-dark: mix(#000, $purple-hollyhock, 20%);
.element {
color: $purple-hollyhock;
box-shadow: 0 0 0 2px rgba($purple-hollyhock, 0.35);
}