Imagine8

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

Zurück zur Bibliothek

Imagine8

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

Bearbeiten

Lebendig 8 Farben Warm Gemischt Komplementär warm bright rainbow childhood

Likes 144

Farben 8

CSS-Variablen

:root {
  --c-vibrant-1: #DE024E;
  --c-vibrant-2: #FC4E51;
  --c-vibrant-3: #FFAB89;
  --c-vibrant-4: #24793D;
  --c-vibrant-5: #0E3ABF;
  --c-vibrant-6: #9350AA;
  --c-vibrant-7: #8E252E;
  --c-vibrant-8: #401B20;
}

Über diese Palette

Diese lebendige Palette mit 8 Farben reicht vom hellsten Ton Sunset Over the Alps (#FFAB89) bis zum dunkelsten Ton Bruised Plum (#401B20). Sie vereint UA Red, Pumping Spice, Sunset Over the Alps, Gorgeous Green, Persian Blue, Purpureus, Rio Red und Bruised Plum in einem Set, das du direkt in deine Benutzeroberfläche übernehmen kannst. Farbpaare in der Palette: 28. Davon erreichen 4 die WCAG-AA-Kontrastschwelle (4,5:1) für Fließtext – am stärksten ist #FFAB89 auf #401B20 mit 8,2:1.

Eine vielseitige Palette für Marketingseiten, Hero-Blöcke von Produkten, Illustrationen und Akzentzustände in der UI.

Farben im Detail

UA Red #DE024E

RGB: rgb(222, 2, 78)
HSL: hsl(339, 98%, 44%)
Luminanz: 0,161

Pumping Spice #FC4E51

RGB: rgb(252, 78, 81)
HSL: hsl(359, 97%, 65%)
Luminanz: 0,267

Sunset Over the Alps #FFAB89

RGB: rgb(255, 171, 137)
HSL: hsl(17, 100%, 77%)
Luminanz: 0,522

Gorgeous Green #24793D

RGB: rgb(36, 121, 61)
HSL: hsl(138, 54%, 31%)
Luminanz: 0,144

Persian Blue #0E3ABF

RGB: rgb(14, 58, 191)
HSL: hsl(225, 86%, 40%)
Luminanz: 0,069

Purpureus #9350AA

RGB: rgb(147, 80, 170)
HSL: hsl(285, 36%, 49%)
Luminanz: 0,148

Rio Red #8E252E

RGB: rgb(142, 37, 46)
HSL: hsl(355, 59%, 35%)
Luminanz: 0,073

Bruised Plum #401B20

RGB: rgb(64, 27, 32)
HSL: hsl(352, 41%, 18%)
Luminanz: 0,020

Kontrast & Barrierefreiheit

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

Aa #FFAB89 auf #401B20 8,20:1 AAA

Aa #FFAB89 auf #0E3ABF 4,81:1 AA

Aa #FFAB89 auf #8E252E 4,66:1 AA

Aa #FC4E51 auf #401B20 4,55:1 AA

Aa #DE024E auf #401B20 3,03:1 AA (großer Text)

Aa #FFAB89 auf #24793D 2,95:1 Nicht bestanden

Aa #FFAB89 auf #9350AA 2,88:1 Nicht bestanden

Aa #9350AA auf #401B20 2,84:1 Nicht bestanden

Aa #24793D auf #401B20 2,78:1 Nicht bestanden

Aa #DE024E auf #FFAB89 2,71:1 Nicht bestanden

Aa #FC4E51 auf #0E3ABF 2,67:1 Nicht bestanden

Aa #FC4E51 auf #8E252E 2,59:1 Nicht bestanden

Aa #FC4E51 auf #FFAB89 1,80:1 Nicht bestanden

Aa #DE024E auf #0E3ABF 1,78:1 Nicht bestanden

Aa #8E252E auf #401B20 1,76:1 Nicht bestanden

Aa #DE024E auf #8E252E 1,72:1 Nicht bestanden

Aa #0E3ABF auf #401B20 1,70:1 Nicht bestanden

Aa #0E3ABF auf #9350AA 1,67:1 Nicht bestanden

Aa #FC4E51 auf #24793D 1,64:1 Nicht bestanden

Aa #24793D auf #0E3ABF 1,63:1 Nicht bestanden

Aa #9350AA auf #8E252E 1,62:1 Nicht bestanden

Aa #FC4E51 auf #9350AA 1,60:1 Nicht bestanden

Aa #24793D auf #8E252E 1,58:1 Nicht bestanden

Aa #DE024E auf #FC4E51 1,50:1 Nicht bestanden

Aa #DE024E auf #24793D 1,09:1 Nicht bestanden

Aa #DE024E auf #9350AA 1,06:1 Nicht bestanden

Aa #0E3ABF auf #8E252E 1,03:1 Nicht bestanden

Aa #24793D auf #9350AA 1,02:1 Nicht bestanden

Imagine8

Imagine8

CSS-Variablen

Über diese Palette

Farben im Detail

Kontrast & Barrierefreiheit

Ähnliche Paletten

Schriftarten

Icons & SVG

Farben

Bilder

CSS-Tools

Entwicklung

Dokumentation

Unternehmen