120385

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

Zurück zur Bibliothek

120385

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

Bearbeiten

Erdig 9 Farben Warm Gemischt Komplementär

Likes 23

Farben 9

CSS-Variablen

:root {
  --c-earthy-1: #E49A80;
  --c-earthy-2: #E4B884;
  --c-earthy-3: #E4D488;
  --c-earthy-4: #B4B884;
  --c-earthy-5: #849A78;
  --c-earthy-6: #5C7C68;
  --c-earthy-7: #849AAC;
  --c-earthy-8: #4C547A;
  --c-earthy-9: #8E8897;
}

Über diese Palette

Diese erdige Palette mit 9 Farben reicht vom hellsten Ton Artichoke Heart (#E4D488) bis zum dunkelsten Ton Deep Indigo (#4C547A). Sie vereint Sockeye, Cane Sugar, Artichoke Heart, Fancy Flirt, Backyard, Stone Cypress Green, Beach Umbrella, Deep Indigo und Purple Ragwort in einem Set, das du direkt in deine Benutzeroberfläche übernehmen kannst. Farbpaare in der Palette: 36. Davon erreicht 1 die WCAG-AA-Kontrastschwelle (4,5:1) für Fließtext – am stärksten ist #E4D488 auf #4C547A mit 4,93: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

Sockeye #E49A80

RGB: rgb(228, 154, 128)
HSL: hsl(16, 65%, 70%)
Luminanz: 0,412

Cane Sugar #E4B884

RGB: rgb(228, 184, 132)
HSL: hsl(33, 64%, 71%)
Luminanz: 0,524

Artichoke Heart #E4D488

RGB: rgb(228, 212, 136)
HSL: hsl(50, 63%, 71%)
Luminanz: 0,654

Fancy Flirt #B4B884

RGB: rgb(180, 184, 132)
HSL: hsl(65, 27%, 62%)
Luminanz: 0,457

Backyard #849A78

RGB: rgb(132, 154, 120)
HSL: hsl(99, 14%, 54%)
Luminanz: 0,294

Stone Cypress Green #5C7C68

RGB: rgb(92, 124, 104)
HSL: hsl(143, 15%, 42%)
Luminanz: 0,177

Beach Umbrella #849AAC

RGB: rgb(132, 154, 172)
HSL: hsl(207, 19%, 60%)
Luminanz: 0,310

Deep Indigo #4C547A

RGB: rgb(76, 84, 122)
HSL: hsl(230, 23%, 39%)
Luminanz: 0,093

Purple Ragwort #8E8897

RGB: rgb(142, 136, 151)
HSL: hsl(264, 7%, 56%)
Luminanz: 0,256

Kontrast & Barrierefreiheit

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

Aa #E4D488 auf #4C547A 4,93:1 AA

Aa #E4B884 auf #4C547A 4,02:1 AA (großer Text)

Aa #B4B884 auf #4C547A 3,55:1 AA (großer Text)

Aa #E49A80 auf #4C547A 3,23:1 AA (großer Text)

Aa #E4D488 auf #5C7C68 3,10:1 AA (großer Text)

Aa #E4B884 auf #5C7C68 2,53:1 Nicht bestanden

Aa #849AAC auf #4C547A 2,52:1 Nicht bestanden

Aa #849A78 auf #4C547A 2,41:1 Nicht bestanden

Aa #E4D488 auf #8E8897 2,30:1 Nicht bestanden

Aa #B4B884 auf #5C7C68 2,23:1 Nicht bestanden

Aa #4C547A auf #8E8897 2,14:1 Nicht bestanden

Aa #E4D488 auf #849A78 2,05:1 Nicht bestanden

Aa #E49A80 auf #5C7C68 2,03:1 Nicht bestanden

Aa #E4D488 auf #849AAC 1,95:1 Nicht bestanden

Aa #E4B884 auf #8E8897 1,88:1 Nicht bestanden

Aa #E4B884 auf #849A78 1,67:1 Nicht bestanden

Aa #B4B884 auf #8E8897 1,66:1 Nicht bestanden

Aa #E4B884 auf #849AAC 1,60:1 Nicht bestanden

Aa #5C7C68 auf #849AAC 1,59:1 Nicht bestanden

Aa #5C7C68 auf #4C547A 1,59:1 Nicht bestanden

Aa #E49A80 auf #E4D488 1,52:1 Nicht bestanden

Aa #E49A80 auf #8E8897 1,51:1 Nicht bestanden

Aa #849A78 auf #5C7C68 1,51:1 Nicht bestanden

Aa #B4B884 auf #849A78 1,47:1 Nicht bestanden

Aa #B4B884 auf #849AAC 1,41:1 Nicht bestanden

Aa #E4D488 auf #B4B884 1,39:1 Nicht bestanden

Aa #5C7C68 auf #8E8897 1,35:1 Nicht bestanden

Aa #E49A80 auf #849A78 1,34:1 Nicht bestanden

Aa #E49A80 auf #849AAC 1,28:1 Nicht bestanden

Aa #E49A80 auf #E4B884 1,24:1 Nicht bestanden

Aa #E4B884 auf #E4D488 1,22:1 Nicht bestanden

Aa #849AAC auf #8E8897 1,18:1 Nicht bestanden

Aa #E4B884 auf #B4B884 1,13:1 Nicht bestanden

Aa #849A78 auf #8E8897 1,12:1 Nicht bestanden

Aa #E49A80 auf #B4B884 1,10:1 Nicht bestanden

Aa #849A78 auf #849AAC 1,05:1 Nicht bestanden

120385

120385

CSS-Variablen

Über diese Palette

Farben im Detail

Kontrast & Barrierefreiheit

Ähnliche Paletten

Schriftarten

Icons & SVG

Farben

Bilder

CSS-Tools

Entwicklung

Dokumentation

Unternehmen