Benannte Farbe · #660088
Peaceful Purple
Peaceful Purple ist #660088: rgb(102 0 136), hsl(285 100% 27%), oklch(0.384 0.191 313.8). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Purple mean? → · Peaceful Purple color name →
#660088
oklch(0.384 0.191 313.8)
Farbumrechnungen
- HEX
- #660088
- RGB
- rgb(102 0 136)
- HSL
- hsl(285 100% 27%)
- HWB
- hwb(285 0% 47%)
- OKLCH
- oklch(0.384 0.191 313.8)
- OKLab
- oklab(0.384 0.132 -0.138)
- CIE Lab
- lab(25.1 52.26 -49.01)
- LCH
- lch(25.1 71.65 316.8)
- CMYK
- cmyk(25% 100% 0% 47%)
Tints · Shades · Tones
Tints
- 752B95
- 8445A1
- 935DAE
- A274BA
- B18AC6
- C1A1D2
- D0B8DD
- E0D0E9
- EFE7F4
Shades
- 580075
- 4A0063
- 3C0052
- 2F0041
- 230031
- 170022
- 0C0013
- 040006
- 000001
Tones
- 691D88
- 6C2D88
- 6F3A88
- 724588
- 745087
- 775A86
- 796485
- 7C6D84
- 7E7782
Farbharmonien
Komplementär +180°
- 660088
Peaceful Purple
- 294F00
≈ Patch of Land
Analog -30° +30°
- 660088
Peaceful Purple
- 4021A2
≈ Indigo Blue
- 790059
≈ Xereus Purple
Triadisch +120° +240°
- 660088
Peaceful Purple
- 5D3C00
≈ Hippogriff Brown
- 004E4E
≈ Antique Turquoise
Geteilt komplementär +150° +210°
- 660088
Peaceful Purple
- 4B4500
≈ Alligator Gladiator
- 005137
≈ Trapper Green
Tetradisch +90° +180° +270°
- 660088
Peaceful Purple
- 722A00
≈ Chestnut
- 294F00
≈ Patch of Land
- 004B60
≈ Lazurite Blue
Kontrast & Barrierefreiheit
Ag
AAAAuf Weiß
WCAG 10.93:1 · APCA Lc 93
Ag
FailAuf Schwarz
WCAG 1.92:1 · APCA Lc 9
Beste Textfarbe: #FFFFFF
WCAG 10.93:1 (AAA) · APCA Lc 93
Contrast pairs
Code-Snippets
CSS
:root {
--peaceful-purple: #660088;
--peaceful-purple-rgb: 102 0 136;
--peaceful-purple-oklch: oklch(0.384 0.191 313.8);
}
.element {
color: var(--peaceful-purple);
background-color: hsl(285 100% 27%);
border-color: oklch(0.384 0.191 313.8);
}Tailwind CSS v4
@theme {
--color-peaceful-purple: #660088;
--color-peaceful-purple-50: #ffe5ff;
--color-peaceful-purple-100: #ffd5ff;
--color-peaceful-purple-200: #f4bbff;
--color-peaceful-purple-300: #dd97f9;
--color-peaceful-purple-400: #c677ec;
--color-peaceful-purple-500: #b254dc;
--color-peaceful-purple-600: #9648ba;
--color-peaceful-purple-700: #793a95;
--color-peaceful-purple-800: #582971;
--color-peaceful-purple-900: #3d1c50;
--color-peaceful-purple-950: #270b35;
}SCSS
$peaceful-purple: #660088;
$peaceful-purple-rgb: 102, 0, 136;
$peaceful-purple-light: mix(#fff, $peaceful-purple, 20%);
$peaceful-purple-dark: mix(#000, $peaceful-purple, 20%);
.element {
color: $peaceful-purple;
box-shadow: 0 0 0 2px rgba($peaceful-purple, 0.35);
}