18 Bytes

Palette mit 8 Farben · Kühl · Gemischt · Harmonie: Komplementär

Zurück zur Bibliothek

18 Bytes

Palette mit 8 Farben · Temperatur: Kühl · Ton: Gemischt · Harmonie: Komplementär

Bearbeiten

Erdig 8 Farben Kühl Gemischt Komplementär blue 8colors cold 8

Likes 49

Farben 8

CSS-Variablen

:root {
  --c-earthy-1: #C8D0D8;
  --c-earthy-2: #C8C8A0;
  --c-earthy-3: #B89888;
  --c-earthy-4: #A07098;
  --c-earthy-5: #302828;
  --c-earthy-6: #283058;
  --c-earthy-7: #506878;
  --c-earthy-8: #609068;
}

Über diese Palette

Diese erdige Palette mit 8 Farben reicht vom hellsten Ton Quarzo (#C8D0D8) bis zum dunkelsten Ton Livid Brown (#302828). Sie vereint Quarzo, Watercress Pesto, Cinnamon Roast, Drama Queen, Livid Brown, Boatswain, Prairie Denim und Stone Green 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 #C8D0D8 auf #302828 mit 9,23: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

Quarzo #C8D0D8

RGB: rgb(200, 208, 216)
HSL: hsl(210, 17%, 82%)
Luminanz: 0,624

Watercress Pesto #C8C8A0

RGB: rgb(200, 200, 160)
HSL: hsl(60, 27%, 71%)
Luminanz: 0,561

Cinnamon Roast #B89888

RGB: rgb(184, 152, 136)
HSL: hsl(20, 25%, 63%)
Luminanz: 0,344

Drama Queen #A07098

RGB: rgb(160, 112, 152)
HSL: hsl(310, 20%, 53%)
Luminanz: 0,213

Livid Brown #302828

RGB: rgb(48, 40, 40)
HSL: hsl(0, 9%, 17%)
Luminanz: 0,023

Boatswain #283058

RGB: rgb(40, 48, 88)
HSL: hsl(230, 38%, 25%)
Luminanz: 0,033

Prairie Denim #506878

RGB: rgb(80, 104, 120)
HSL: hsl(204, 20%, 39%)
Luminanz: 0,130

Stone Green #609068

RGB: rgb(96, 144, 104)
HSL: hsl(130, 20%, 47%)
Luminanz: 0,234

Kontrast & Barrierefreiheit

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

Aa #C8D0D8 auf #302828 9,23:1 AAA

Aa #C8C8A0 auf #302828 8,37:1 AAA

Aa #C8D0D8 auf #283058 8,14:1 AAA

Aa #C8C8A0 auf #283058 7,39:1 AAA

Aa #B89888 auf #302828 5,40:1 AA

Aa #B89888 auf #283058 4,77:1 AA

Aa #302828 auf #609068 3,90:1 AA (großer Text)

Aa #C8D0D8 auf #506878 3,75:1 AA (großer Text)

Aa #A07098 auf #302828 3,61:1 AA (großer Text)

Aa #283058 auf #609068 3,44:1 AA (großer Text)

Aa #C8C8A0 auf #506878 3,40:1 AA (großer Text)

Aa #A07098 auf #283058 3,18:1 AA (großer Text)

Aa #C8D0D8 auf #A07098 2,56:1 Nicht bestanden

Aa #302828 auf #506878 2,46:1 Nicht bestanden

Aa #C8D0D8 auf #609068 2,37:1 Nicht bestanden

Aa #C8C8A0 auf #A07098 2,32:1 Nicht bestanden

Aa #B89888 auf #506878 2,19:1 Nicht bestanden

Aa #283058 auf #506878 2,17:1 Nicht bestanden

Aa #C8C8A0 auf #609068 2,15:1 Nicht bestanden

Aa #C8D0D8 auf #B89888 1,71:1 Nicht bestanden

Aa #506878 auf #609068 1,58:1 Nicht bestanden

Aa #C8C8A0 auf #B89888 1,55:1 Nicht bestanden

Aa #B89888 auf #A07098 1,50:1 Nicht bestanden

Aa #A07098 auf #506878 1,47:1 Nicht bestanden

Aa #B89888 auf #609068 1,39:1 Nicht bestanden

Aa #302828 auf #283058 1,13:1 Nicht bestanden

Aa #C8D0D8 auf #C8C8A0 1,10:1 Nicht bestanden

Aa #A07098 auf #609068 1,08:1 Nicht bestanden

18 Bytes

18 Bytes

CSS-Variablen

Über diese Palette

Farben im Detail

Kontrast & Barrierefreiheit

Ähnliche Paletten

Schriftarten

Icons & SVG

Farben

Bilder

CSS-Tools

Entwicklung

Dokumentation

Unternehmen