Coffee8

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

Zurück zur Bibliothek

Coffee8

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

Bearbeiten

Erdig 8 Farben Warm Gemischt Komplementär vibrant warm pastel lofi

Likes 31

Farben 8

CSS-Variablen

:root {
  --c-earthy-1: #342A2B;
  --c-earthy-2: #986C5F;
  --c-earthy-3: #CA9C8D;
  --c-earthy-4: #F4E5E1;
  --c-earthy-5: #7CDCE9;
  --c-earthy-6: #4B8DAD;
  --c-earthy-7: #F86C4C;
  --c-earthy-8: #F49680;
}

Über diese Palette

Diese erdige Palette mit 8 Farben reicht vom hellsten Ton Reverie Pink (#F4E5E1) bis zum dunkelsten Ton Deep Brown (#342A2B). Sie vereint Deep Brown, Safari Brown, Artefact, Reverie Pink, Faded Poster, Sora Sky, Sango Red und Parma Ham in einem Set, das du direkt in deine Benutzeroberfläche übernehmen kannst. Farbpaare in der Palette: 28. Davon erreichen 5 die WCAG-AA-Kontrastschwelle (4,5:1) für Fließtext – am stärksten ist #342A2B auf #F4E5E1 mit 11,34: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

Deep Brown #342A2B

RGB: rgb(52, 42, 43)
HSL: hsl(354, 11%, 18%)
Luminanz: 0,026

Safari Brown #986C5F

RGB: rgb(152, 108, 95)
HSL: hsl(14, 23%, 48%)
Luminanz: 0,182

Artefact #CA9C8D

RGB: rgb(202, 156, 141)
HSL: hsl(15, 37%, 67%)
Luminanz: 0,383

Reverie Pink #F4E5E1

RGB: rgb(244, 229, 225)
HSL: hsl(13, 46%, 92%)
Luminanz: 0,807

Faded Poster #7CDCE9

RGB: rgb(124, 220, 233)
HSL: hsl(187, 71%, 70%)
Luminanz: 0,614

Sora Sky #4B8DAD

RGB: rgb(75, 141, 173)
HSL: hsl(200, 40%, 49%)
Luminanz: 0,236

Sango Red #F86C4C

RGB: rgb(248, 108, 76)
HSL: hsl(11, 92%, 64%)
Luminanz: 0,312

Parma Ham #F49680

RGB: rgb(244, 150, 128)
HSL: hsl(11, 84%, 73%)
Luminanz: 0,426

Kontrast & Barrierefreiheit

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

Aa #342A2B auf #F4E5E1 11,34:1 AAA

Aa #342A2B auf #7CDCE9 8,78:1 AAA

Aa #342A2B auf #F49680 6,30:1 AA

Aa #342A2B auf #CA9C8D 5,72:1 AA

Aa #342A2B auf #F86C4C 4,79:1 AA

Aa #342A2B auf #4B8DAD 3,78:1 AA (großer Text)

Aa #986C5F auf #F4E5E1 3,69:1 AA (großer Text)

Aa #342A2B auf #986C5F 3,07:1 AA (großer Text)

Aa #F4E5E1 auf #4B8DAD 3,00:1 AA (großer Text)

Aa #986C5F auf #7CDCE9 2,86:1 Nicht bestanden

Aa #F4E5E1 auf #F86C4C 2,37:1 Nicht bestanden

Aa #7CDCE9 auf #4B8DAD 2,32:1 Nicht bestanden

Aa #986C5F auf #F49680 2,05:1 Nicht bestanden

Aa #CA9C8D auf #F4E5E1 1,98:1 Nicht bestanden

Aa #986C5F auf #CA9C8D 1,86:1 Nicht bestanden

Aa #7CDCE9 auf #F86C4C 1,83:1 Nicht bestanden

Aa #F4E5E1 auf #F49680 1,80:1 Nicht bestanden

Aa #4B8DAD auf #F49680 1,67:1 Nicht bestanden

Aa #986C5F auf #F86C4C 1,56:1 Nicht bestanden

Aa #CA9C8D auf #7CDCE9 1,53:1 Nicht bestanden

Aa #CA9C8D auf #4B8DAD 1,51:1 Nicht bestanden

Aa #7CDCE9 auf #F49680 1,39:1 Nicht bestanden

Aa #F86C4C auf #F49680 1,31:1 Nicht bestanden

Aa #F4E5E1 auf #7CDCE9 1,29:1 Nicht bestanden

Aa #4B8DAD auf #F86C4C 1,27:1 Nicht bestanden

Aa #986C5F auf #4B8DAD 1,23:1 Nicht bestanden

Aa #CA9C8D auf #F86C4C 1,19:1 Nicht bestanden

Aa #CA9C8D auf #F49680 1,10:1 Nicht bestanden

Coffee8

Coffee8

CSS-Variablen

Über diese Palette

Farben im Detail

Kontrast & Barrierefreiheit

Ähnliche Paletten

Schriftarten

Icons & SVG

Farben

Bilder

CSS-Tools

Entwicklung

Dokumentation

Unternehmen