Benannte Farbe · #531938
Tulip Poplar Purple
Tulip Poplar Purple ist #531938: rgb(83 25 56), hsl(328 54% 21%), oklch(0.317 0.094 350.7). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Brown mean? → · Tulip Poplar Purple color name →
#531938
oklch(0.317 0.094 350.7)
Farbumrechnungen
- HEX
- #531938
- RGB
- rgb(83 25 56)
- HSL
- hsl(328 54% 21%)
- HWB
- hwb(328 10% 67%)
- OKLCH
- oklch(0.317 0.094 350.7)
- OKLab
- oklab(0.317 0.092 -0.015)
- CIE Lab
- lab(19.48 29.87 -5.37)
- LCH
- lch(19.48 30.35 349.8)
- CMYK
- cmyk(0% 70% 33% 67%)
Tints · Shades · Tones
Tints
- 642F49
- 76445C
- 875A6E
- 987082
- A98695
- BA9DAA
- CBB5BE
- DCCDD3
- EEE6E9
Shades
- 47142F
- 3B1027
- 300B1F
- 250717
- 1B040F
- 110208
- 080104
- 020001
- 000000
Tones
- 58243F
- 5E2F46
- 63394D
- 684354
- 6C4D5B
- 715762
- 756169
- 796B71
- 7C7678
Farbharmonien
Komplementär +180°
- 531938
Tulip Poplar Purple
- 003C2D
≈ Deep Fir
Analog -30° +30°
- 531938
Tulip Poplar Purple
- 471F4F
≈ Galactic Wonder
- 58181D
≈ Spinel Red
Triadisch +120° +240°
- 531938
Tulip Poplar Purple
- 343500
≈ Wasabi Nori
- 00374C
≈ Crowberry Blue
Geteilt komplementär +150° +210°
- 531938
Tulip Poplar Purple
- 113D08
≈ Hunter Green
- 003A3D
≈ Customs Green
Tetradisch +90° +180° +270°
- 531938
Tulip Poplar Purple
- 432E00
≈ Hidden Passage
- 003C2D
≈ Deep Fir
- 143061
≈ Mythical Night
Kontrast & Barrierefreiheit
Ag
AAAAuf Weiß
WCAG 13.42:1 · APCA Lc 99
Ag
FailAuf Schwarz
WCAG 1.56:1 · APCA Lc 0
Beste Textfarbe: #FFFFFF
WCAG 13.42:1 (AAA) · APCA Lc 99
Contrast pairs
Code-Snippets
CSS
:root {
--tulip-poplar-purple: #531938;
--tulip-poplar-purple-rgb: 83 25 56;
--tulip-poplar-purple-oklch: oklch(0.317 0.094 350.7);
}
.element {
color: var(--tulip-poplar-purple);
background-color: hsl(328 54% 21%);
border-color: oklch(0.317 0.094 350.7);
}Tailwind CSS v4
@theme {
--color-tulip-poplar-purple: #531938;
--color-tulip-poplar-purple-50: #ffebf8;
--color-tulip-poplar-purple-100: #ffdceb;
--color-tulip-poplar-purple-200: #f5c4d8;
--color-tulip-poplar-purple-300: #dea4bc;
--color-tulip-poplar-purple-400: #c987a5;
--color-tulip-poplar-purple-500: #b56b8e;
--color-tulip-poplar-purple-600: #995b78;
--color-tulip-poplar-purple-700: #7b4960;
--color-tulip-poplar-purple-800: #5a3448;
--color-tulip-poplar-purple-900: #3f2432;
--color-tulip-poplar-purple-950: #28121e;
}SCSS
$tulip-poplar-purple: #531938;
$tulip-poplar-purple-rgb: 83, 25, 56;
$tulip-poplar-purple-light: mix(#fff, $tulip-poplar-purple, 20%);
$tulip-poplar-purple-dark: mix(#000, $tulip-poplar-purple, 20%);
.element {
color: $tulip-poplar-purple;
box-shadow: 0 0 0 2px rgba($tulip-poplar-purple, 0.35);
}