Pumpkin8

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

Zurück zur Bibliothek

Pumpkin8

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

Bearbeiten

Lebendig 8 Farben Warm Gemischt Komplementär colorful spooky halloween pumpkin

Likes 26

Farben 8

CSS-Variablen

:root {
  --c-vibrant-1: #FAFFE0;
  --c-vibrant-2: #FFEE91;
  --c-vibrant-3: #E5AB0E;
  --c-vibrant-4: #B00061;
  --c-vibrant-5: #2E074A;
  --c-vibrant-6: #0D5880;
  --c-vibrant-7: #29CCAD;
  --c-vibrant-8: #7CF076;
}

Über diese Palette

Diese lebendige Palette mit 8 Farben reicht vom hellsten Ton Ceramite White (#FAFFE0) bis zum dunkelsten Ton Oily Purple (#2E074A). Sie vereint Ceramite White, The First Daffodil, Filthy Brown, Velvet Cupcake, Oily Purple, Commandes, Jade Mountain und Herbivore in einem Set, das du direkt in deine Benutzeroberfläche übernehmen kannst. Farbpaare in der Palette: 28. Davon erreichen 11 die WCAG-AA-Kontrastschwelle (4,5:1) für Fließtext – am stärksten ist #FAFFE0 auf #2E074A mit 16,42:1.

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

Farben im Detail

Ceramite White #FAFFE0

RGB: rgb(250, 255, 224)
HSL: hsl(70, 100%, 94%)
Luminanz: 0,972

The First Daffodil #FFEE91

RGB: rgb(255, 238, 145)
HSL: hsl(51, 100%, 78%)
Luminanz: 0,845

Filthy Brown #E5AB0E

RGB: rgb(229, 171, 14)
HSL: hsl(44, 88%, 48%)
Luminanz: 0,458

Velvet Cupcake #B00061

RGB: rgb(176, 0, 97)
HSL: hsl(327, 100%, 35%)
Luminanz: 0,101

Oily Purple #2E074A

RGB: rgb(46, 7, 74)
HSL: hsl(275, 83%, 16%)
Luminanz: 0,012

Commandes #0D5880

RGB: rgb(13, 88, 128)
HSL: hsl(201, 82%, 28%)
Luminanz: 0,086

Jade Mountain #29CCAD

RGB: rgb(41, 204, 173)
HSL: hsl(169, 67%, 48%)
Luminanz: 0,467

Herbivore #7CF076

RGB: rgb(124, 240, 118)
HSL: hsl(117, 80%, 70%)
Luminanz: 0,679

Kontrast & Barrierefreiheit

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

Aa #FAFFE0 auf #2E074A 16,42:1 AAA

Aa #FFEE91 auf #2E074A 14,36:1 AAA

Aa #2E074A auf #7CF076 11,71:1 AAA

Aa #2E074A auf #29CCAD 8,30:1 AAA

Aa #E5AB0E auf #2E074A 8,16:1 AAA

Aa #FAFFE0 auf #0D5880 7,50:1 AAA

Aa #FAFFE0 auf #B00061 6,77:1 AA

Aa #FFEE91 auf #0D5880 6,57:1 AA

Aa #FFEE91 auf #B00061 5,93:1 AA

Aa #0D5880 auf #7CF076 5,35:1 AA

Aa #B00061 auf #7CF076 4,83:1 AA

Aa #0D5880 auf #29CCAD 3,79:1 AA (großer Text)

Aa #E5AB0E auf #0D5880 3,73:1 AA (großer Text)

Aa #B00061 auf #29CCAD 3,42:1 AA (großer Text)

Aa #E5AB0E auf #B00061 3,37:1 AA (großer Text)

Aa #B00061 auf #2E074A 2,42:1 Nicht bestanden

Aa #2E074A auf #0D5880 2,19:1 Nicht bestanden

Aa #FAFFE0 auf #E5AB0E 2,01:1 Nicht bestanden

Aa #FAFFE0 auf #29CCAD 1,98:1 Nicht bestanden

Aa #FFEE91 auf #E5AB0E 1,76:1 Nicht bestanden

Aa #FFEE91 auf #29CCAD 1,73:1 Nicht bestanden

Aa #E5AB0E auf #7CF076 1,43:1 Nicht bestanden

Aa #29CCAD auf #7CF076 1,41:1 Nicht bestanden

Aa #FAFFE0 auf #7CF076 1,40:1 Nicht bestanden

Aa #FFEE91 auf #7CF076 1,23:1 Nicht bestanden

Aa #FAFFE0 auf #FFEE91 1,14:1 Nicht bestanden

Aa #B00061 auf #0D5880 1,11:1 Nicht bestanden

Aa #E5AB0E auf #29CCAD 1,02:1 Nicht bestanden

Pumpkin8

Pumpkin8

CSS-Variablen

Über diese Palette

Farben im Detail

Kontrast & Barrierefreiheit

Ähnliche Paletten

Schriftarten

Icons & SVG

Farben

Bilder

CSS-Tools

Entwicklung

Dokumentation

Unternehmen