Fggg

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

Zurück zur Bibliothek

Fggg

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

Bearbeiten

Erdig 8 Farben Warm Gemischt Komplementär aigh jhgggj jkkddds kdjffg

Likes 5

Farben 8

CSS-Variablen

:root {
  --c-earthy-1: #523A28;
  --c-earthy-2: #A97F5A;
  --c-earthy-3: #D8D8D8;
  --c-earthy-4: #5E5E5E;
  --c-earthy-5: #FF0000;
  --c-earthy-6: #F5B800;
  --c-earthy-7: #00FF00;
  --c-earthy-8: #0048FF;
}

Über diese Palette

Diese erdige Palette mit 8 Farben reicht vom hellsten Ton Green (#00FF00) bis zum dunkelsten Ton Bonanza (#523A28). Sie vereint Bonanza, Penny, Gliding Feather, Iron, Red, Curry Bubbles, Green und Magic Ink in einem Set, das du direkt in deine Benutzeroberfläche übernehmen kannst. Farbpaare in der Palette: 28. Davon erreichen 6 die WCAG-AA-Kontrastschwelle (4,5:1) für Fließtext – am stärksten ist #523A28 auf #00FF00 mit 7,67: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

Bonanza #523A28

RGB: rgb(82, 58, 40)
HSL: hsl(26, 34%, 24%)
Luminanz: 0,050

Penny #A97F5A

RGB: rgb(169, 127, 90)
HSL: hsl(28, 31%, 51%)
Luminanz: 0,244

Gliding Feather #D8D8D8

RGB: rgb(216, 216, 216)
HSL: hsl(0, 0%, 85%)
Luminanz: 0,687

Iron #5E5E5E

RGB: rgb(94, 94, 94)
HSL: hsl(0, 0%, 37%)
Luminanz: 0,112

Red #FF0000

RGB: rgb(255, 0, 0)
HSL: hsl(0, 100%, 50%)
Luminanz: 0,213

Curry Bubbles #F5B800

RGB: rgb(245, 184, 0)
HSL: hsl(45, 100%, 48%)
Luminanz: 0,537

Green #00FF00

RGB: rgb(0, 255, 0)
HSL: hsl(120, 100%, 50%)
Luminanz: 0,715

Magic Ink #0048FF

RGB: rgb(0, 72, 255)
HSL: hsl(223, 100%, 50%)
Luminanz: 0,119

Kontrast & Barrierefreiheit

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

Aa #523A28 auf #00FF00 7,67:1 AAA

Aa #523A28 auf #D8D8D8 7,39:1 AAA

Aa #523A28 auf #F5B800 5,89:1 AA

Aa #5E5E5E auf #00FF00 4,73:1 AA

Aa #D8D8D8 auf #5E5E5E 4,55:1 AA

Aa #00FF00 auf #0048FF 4,54:1 AA

Aa #D8D8D8 auf #0048FF 4,37:1 AA (großer Text)

Aa #5E5E5E auf #F5B800 3,62:1 AA (großer Text)

Aa #F5B800 auf #0048FF 3,48:1 AA (großer Text)

Aa #523A28 auf #A97F5A 2,94:1 Nicht bestanden

Aa #FF0000 auf #00FF00 2,91:1 Nicht bestanden

Aa #D8D8D8 auf #FF0000 2,81:1 Nicht bestanden

Aa #523A28 auf #FF0000 2,63:1 Nicht bestanden

Aa #A97F5A auf #00FF00 2,61:1 Nicht bestanden

Aa #A97F5A auf #D8D8D8 2,51:1 Nicht bestanden

Aa #FF0000 auf #F5B800 2,24:1 Nicht bestanden

Aa #A97F5A auf #F5B800 2,00:1 Nicht bestanden

Aa #A97F5A auf #5E5E5E 1,81:1 Nicht bestanden

Aa #A97F5A auf #0048FF 1,74:1 Nicht bestanden

Aa #523A28 auf #0048FF 1,69:1 Nicht bestanden

Aa #523A28 auf #5E5E5E 1,62:1 Nicht bestanden

Aa #5E5E5E auf #FF0000 1,62:1 Nicht bestanden

Aa #FF0000 auf #0048FF 1,56:1 Nicht bestanden

Aa #F5B800 auf #00FF00 1,30:1 Nicht bestanden

Aa #D8D8D8 auf #F5B800 1,26:1 Nicht bestanden

Aa #A97F5A auf #FF0000 1,12:1 Nicht bestanden

Aa #D8D8D8 auf #00FF00 1,04:1 Nicht bestanden

Aa #5E5E5E auf #0048FF 1,04:1 Nicht bestanden

Fggg

Fggg

CSS-Variablen

Über diese Palette

Farben im Detail

Kontrast & Barrierefreiheit

Ähnliche Paletten

Schriftarten

Icons & SVG

Farben

Bilder

CSS-Tools

Entwicklung

Dokumentation

Unternehmen