Benannte Farbe · #BF36E0
Eupatorium Purple
Eupatorium Purple ist #BF36E0: rgb(191 54 224), hsl(288 73% 55%), oklch(0.609 0.253 318.8). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Purple mean? → · Eupatorium Purple color name →
#BF36E0
oklch(0.609 0.253 318.8)
Farbumrechnungen
- HEX
- #bf36e0
- RGB
- rgb(191 54 224)
- HSL
- hsl(288 73% 55%)
- HWB
- hwb(288 21% 12%)
- OKLCH
- oklch(0.609 0.253 318.8)
- OKLab
- oklab(0.609 0.191 -0.167)
- CIE Lab
- lab(50.4 69.79 -59.5)
- LCH
- lch(50.4 91.71 319.6)
- CMYK
- cmyk(15% 76% 0% 12%)
Tints · Shades · Tones
Tints
- C752E4
- CE69E8
- D57EEC
- DC91F0
- E2A4F3
- E8B7F6
- EEC9F9
- F4DBFB
- FAEDFD
Shades
- A62EC3
- 8D25A6
- 751E8A
- 5E1670
- 480F56
- 33083E
- 1F0327
- 0D0112
- 020002
Tones
- B944D7
- B34FCE
- AE58C4
- A860BB
- A167B1
- 9B6DA8
- 95729E
- 8E7794
- 877C8A
Farbharmonien
Komplementär +180°
- BF36E0
Eupatorium Purple
- 399C00
≈ Grassy Green
Analog -30° +30°
- BF36E0
Eupatorium Purple
- 845EFF
≈ Purple Honeycreeper
- E4069B
≈ Love Vessel
Triadisch +120° +240°
- BF36E0
Eupatorium Purple
- AB7800
≈ Bronze
- 00959A
≈ Peacock Feather
Geteilt komplementär +150° +210°
- BF36E0
Eupatorium Purple
- 8A8800
≈ Palak Paneer
- 009A76
≈ Jardinière
Tetradisch +90° +180° +270°
- BF36E0
Eupatorium Purple
- CD5D00
≈ Rusty Orange
- 399C00
≈ Grassy Green
- 008FBC
≈ Hawaiian Surf
Kontrast & Barrierefreiheit
Ag
FailAuf Weiß
WCAG 4.35:1 · APCA Lc 69
Ag
AAAuf Schwarz
WCAG 4.81:1 · APCA Lc 33
Beste Textfarbe: #000000
WCAG 4.81:1 (AA) · APCA Lc 33
Contrast pairs
Code-Snippets
CSS
:root {
--eupatorium-purple: #bf36e0;
--eupatorium-purple-rgb: 191 54 224;
--eupatorium-purple-oklch: oklch(0.609 0.253 318.8);
}
.element {
color: var(--eupatorium-purple);
background-color: hsl(288 73% 55%);
border-color: oklch(0.609 0.253 318.8);
}Tailwind CSS v4
@theme {
--color-eupatorium-purple: #bf36e0;
--color-eupatorium-purple-50: #ffdeff;
--color-eupatorium-purple-100: #ffccff;
--color-eupatorium-purple-200: #ffaeff;
--color-eupatorium-purple-300: #f086ff;
--color-eupatorium-purple-400: #db5efb;
--color-eupatorium-purple-500: #c826ed;
--color-eupatorium-purple-600: #a925c8;
--color-eupatorium-purple-700: #881ea0;
--color-eupatorium-purple-800: #63157a;
--color-eupatorium-purple-900: #460e56;
--color-eupatorium-purple-950: #2d003a;
}SCSS
$eupatorium-purple: #bf36e0;
$eupatorium-purple-rgb: 191, 54, 224;
$eupatorium-purple-light: mix(#fff, $eupatorium-purple, 20%);
$eupatorium-purple-dark: mix(#000, $eupatorium-purple, 20%);
.element {
color: $eupatorium-purple;
box-shadow: 0 0 0 2px rgba($eupatorium-purple, 0.35);
}