Heptarainbow

Palette mit 7 Farben · Warm · Gemischt · Harmonie: Komplementär

Zurück zur Bibliothek

Heptarainbow

Palette mit 7 Farben · Temperatur: Warm · Ton: Gemischt · Harmonie: Komplementär

Bearbeiten

Erdig 7 Farben Warm Gemischt Komplementär 7 colorful saturated rainbow

Likes 44

Farben 7

CSS-Variablen

:root {
  --c-earthy-1: #47346A;
  --c-earthy-2: #667B9D;
  --c-earthy-3: #97BFB5;
  --c-earthy-4: #EEEDDA;
  --c-earthy-5: #CCB5A7;
  --c-earthy-6: #B57E8F;
  --c-earthy-7: #914C89;
}

Über diese Palette

Diese erdige Palette mit 7 Farben reicht vom hellsten Ton Cravat (#EEEDDA) bis zum dunkelsten Ton Petunia (#47346A). Sie vereint Petunia, Smoky Violet, Carnival Glass, Cravat, Rustic Rose, Degas Pink und Striking Purple in einem Set, das du direkt in deine Benutzeroberfläche übernehmen kannst. Farbpaare in der Palette: 21. Davon erreichen 4 die WCAG-AA-Kontrastschwelle (4,5:1) für Fließtext – am stärksten ist #47346A auf #EEEDDA mit 9,03:1.

Bodenständige, natürliche Töne – passend für nachhaltige und Bio-Marken, Cafés, Outdoor-Ausrüstung und warme redaktionelle Typografie.

Farben im Detail

Petunia #47346A

RGB: rgb(71, 52, 106)
HSL: hsl(261, 34%, 31%)
Luminanz: 0,048

Smoky Violet #667B9D

RGB: rgb(102, 123, 157)
HSL: hsl(217, 22%, 51%)
Luminanz: 0,194

Carnival Glass #97BFB5

RGB: rgb(151, 191, 181)
HSL: hsl(165, 24%, 67%)
Luminanz: 0,472

Cravat #EEEDDA

RGB: rgb(238, 237, 218)
HSL: hsl(57, 37%, 89%)
Luminanz: 0,838

Rustic Rose #CCB5A7

RGB: rgb(204, 181, 167)
HSL: hsl(23, 27%, 73%)
Luminanz: 0,487

Degas Pink #B57E8F

RGB: rgb(181, 126, 143)
HSL: hsl(341, 27%, 60%)
Luminanz: 0,267

Striking Purple #914C89

RGB: rgb(145, 76, 137)
HSL: hsl(307, 31%, 43%)
Luminanz: 0,130

Kontrast & Barrierefreiheit

4 von 21 Farbpaaren erreichen die WCAG-AA-Kontrastschwelle (4,5:1) für Fließtext.

Aa #47346A auf #EEEDDA 9,03:1 AAA

Aa #47346A auf #CCB5A7 5,46:1 AA

Aa #47346A auf #97BFB5 5,30:1 AA

Aa #EEEDDA auf #914C89 4,94:1 AA

Aa #667B9D auf #EEEDDA 3,64:1 AA (großer Text)

Aa #47346A auf #B57E8F 3,23:1 AA (großer Text)

Aa #CCB5A7 auf #914C89 2,98:1 Nicht bestanden

Aa #97BFB5 auf #914C89 2,90:1 Nicht bestanden

Aa #EEEDDA auf #B57E8F 2,80:1 Nicht bestanden

Aa #47346A auf #667B9D 2,48:1 Nicht bestanden

Aa #667B9D auf #CCB5A7 2,20:1 Nicht bestanden

Aa #667B9D auf #97BFB5 2,14:1 Nicht bestanden

Aa #47346A auf #914C89 1,83:1 Nicht bestanden

Aa #B57E8F auf #914C89 1,76:1 Nicht bestanden

Aa #97BFB5 auf #EEEDDA 1,70:1 Nicht bestanden

Aa #CCB5A7 auf #B57E8F 1,69:1 Nicht bestanden

Aa #EEEDDA auf #CCB5A7 1,65:1 Nicht bestanden

Aa #97BFB5 auf #B57E8F 1,64:1 Nicht bestanden

Aa #667B9D auf #914C89 1,36:1 Nicht bestanden

Aa #667B9D auf #B57E8F 1,30:1 Nicht bestanden

Aa #97BFB5 auf #CCB5A7 1,03:1 Nicht bestanden

Heptarainbow

Heptarainbow

CSS-Variablen

Über diese Palette

Farben im Detail

Kontrast & Barrierefreiheit

Ähnliche Paletten

Schriftarten

Icons & SVG

Farben

Bilder

CSS-Tools

Entwicklung

Dokumentation

Unternehmen