Popcorn 7

Palette mit 7 Farben · Warm · Gemischt · Harmonie: Analog

Zurück zur Bibliothek

Popcorn 7

Palette mit 7 Farben · Temperatur: Warm · Ton: Gemischt · Harmonie: Analog

Bearbeiten

Lebendig 7 Farben Warm Gemischt Analog 7 red yellow food

Likes 38

Farben 7

CSS-Variablen

:root {
  --c-vibrant-1: #591427;
  --c-vibrant-2: #8C3033;
  --c-vibrant-3: #FF3F56;
  --c-vibrant-4: #FF9EA1;
  --c-vibrant-5: #FFE1B0;
  --c-vibrant-6: #FFFEA6;
  --c-vibrant-7: #FFCE6D;
}

Über diese Palette

Diese lebendige Palette mit 7 Farben reicht vom hellsten Ton Ginger Lemon Tea (#FFFEA6) bis zum dunkelsten Ton Spinel Red (#591427). Sie vereint Spinel Red, Old Brick, Hotter Than Hell, Salmon Tartare, Creamy Oat, Ginger Lemon Tea und Faded Sunlight in einem Set, das du direkt in deine Benutzeroberfläche übernehmen kannst. Farbpaare in der Palette: 21. Davon erreichen 7 die WCAG-AA-Kontrastschwelle (4,5:1) für Fließtext – am stärksten ist #591427 auf #FFFEA6 mit 12,86:1.

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

Farben im Detail

Spinel Red #591427

RGB: rgb(89, 20, 39)
HSL: hsl(343, 63%, 21%)
Luminanz: 0,028

Old Brick #8C3033

RGB: rgb(140, 48, 51)
HSL: hsl(358, 49%, 37%)
Luminanz: 0,079

Hotter Than Hell #FF3F56

RGB: rgb(255, 63, 86)
HSL: hsl(353, 100%, 62%)
Luminanz: 0,255

Salmon Tartare #FF9EA1

RGB: rgb(255, 158, 161)
HSL: hsl(358, 100%, 81%)
Luminanz: 0,483

Creamy Oat #FFE1B0

RGB: rgb(255, 225, 176)
HSL: hsl(37, 100%, 85%)
Luminanz: 0,783

Ginger Lemon Tea #FFFEA6

RGB: rgb(255, 254, 166)
HSL: hsl(59, 100%, 83%)
Luminanz: 0,949

Faded Sunlight #FFCE6D

RGB: rgb(255, 206, 109)
HSL: hsl(40, 100%, 71%)
Luminanz: 0,665

Kontrast & Barrierefreiheit

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

Aa #591427 auf #FFFEA6 12,86:1 AAA

Aa #591427 auf #FFE1B0 10,71:1 AAA

Aa #591427 auf #FFCE6D 9,20:1 AAA

Aa #8C3033 auf #FFFEA6 7,73:1 AAA

Aa #591427 auf #FF9EA1 6,86:1 AA

Aa #8C3033 auf #FFE1B0 6,44:1 AA

Aa #8C3033 auf #FFCE6D 5,53:1 AA

Aa #8C3033 auf #FF9EA1 4,12:1 AA (großer Text)

Aa #591427 auf #FF3F56 3,92:1 AA (großer Text)

Aa #FF3F56 auf #FFFEA6 3,28:1 AA (großer Text)

Aa #FF3F56 auf #FFE1B0 2,73:1 Nicht bestanden

Aa #8C3033 auf #FF3F56 2,36:1 Nicht bestanden

Aa #FF3F56 auf #FFCE6D 2,35:1 Nicht bestanden

Aa #FF9EA1 auf #FFFEA6 1,87:1 Nicht bestanden

Aa #FF3F56 auf #FF9EA1 1,75:1 Nicht bestanden

Aa #591427 auf #8C3033 1,66:1 Nicht bestanden

Aa #FF9EA1 auf #FFE1B0 1,56:1 Nicht bestanden

Aa #FFFEA6 auf #FFCE6D 1,40:1 Nicht bestanden

Aa #FF9EA1 auf #FFCE6D 1,34:1 Nicht bestanden

Aa #FFE1B0 auf #FFFEA6 1,20:1 Nicht bestanden

Aa #FFE1B0 auf #FFCE6D 1,16:1 Nicht bestanden

Popcorn 7

Popcorn 7

CSS-Variablen

Über diese Palette

Farben im Detail

Kontrast & Barrierefreiheit

Ähnliche Paletten

Schriftarten

Icons & SVG

Farben

Bilder

CSS-Tools

Entwicklung

Dokumentation

Unternehmen