Pigment 🎨

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

Zurück zur Bibliothek

Pigment 🎨

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

Bearbeiten

Erdig 8 Farben Warm Gemischt Komplementär color polyphrog

Likes 34

Farben 8

CSS-Variablen

:root {
  --c-earthy-1: #553E5B;
  --c-earthy-2: #928F8E;
  --c-earthy-3: #F8F8D1;
  --c-earthy-4: #6D8C4A;
  --c-earthy-5: #4A443C;
  --c-earthy-6: #342121;
  --c-earthy-7: #7B4136;
  --c-earthy-8: #C59846;
}

Über diese Palette

Diese erdige Palette mit 8 Farben reicht vom hellsten Ton Utepils (#F8F8D1) bis zum dunkelsten Ton Hornblende (#342121). Sie vereint English Violet, Plum Smoke, Utepils, Athonian Camoshade, Earth Black, Hornblende, Aged Teak und Nattō 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 #F8F8D1 auf #342121 mit 13,96: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

English Violet #553E5B

RGB: rgb(85, 62, 91)
HSL: hsl(288, 19%, 30%)
Luminanz: 0,061

Plum Smoke #928F8E

RGB: rgb(146, 143, 142)
HSL: hsl(15, 2%, 56%)
Luminanz: 0,277

Utepils #F8F8D1

RGB: rgb(248, 248, 209)
HSL: hsl(60, 74%, 90%)
Luminanz: 0,917

Athonian Camoshade #6D8C4A

RGB: rgb(109, 140, 74)
HSL: hsl(88, 31%, 42%)
Luminanz: 0,225

Earth Black #4A443C

RGB: rgb(74, 68, 60)
HSL: hsl(34, 10%, 26%)
Luminanz: 0,059

Hornblende #342121

RGB: rgb(52, 33, 33)
HSL: hsl(0, 22%, 17%)
Luminanz: 0,019

Aged Teak #7B4136

RGB: rgb(123, 65, 54)
HSL: hsl(10, 39%, 35%)
Luminanz: 0,083

Nattō #C59846

RGB: rgb(197, 152, 70)
HSL: hsl(39, 52%, 52%)
Luminanz: 0,348

Kontrast & Barrierefreiheit

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

Aa #F8F8D1 auf #342121 13,96:1 AAA

Aa #F8F8D1 auf #4A443C 8,86:1 AAA

Aa #553E5B auf #F8F8D1 8,69:1 AAA

Aa #F8F8D1 auf #7B4136 7,29:1 AAA

Aa #342121 auf #C59846 5,74:1 AA

Aa #928F8E auf #342121 4,72:1 AA

Aa #6D8C4A auf #342121 3,97:1 AA (großer Text)

Aa #4A443C auf #C59846 3,64:1 AA (großer Text)

Aa #553E5B auf #C59846 3,57:1 AA (großer Text)

Aa #F8F8D1 auf #6D8C4A 3,52:1 AA (großer Text)

Aa #928F8E auf #4A443C 3,00:1 AA (großer Text)

Aa #7B4136 auf #C59846 3,00:1 AA (großer Text)

Aa #928F8E auf #F8F8D1 2,96:1 Nicht bestanden

Aa #553E5B auf #928F8E 2,94:1 Nicht bestanden

Aa #6D8C4A auf #4A443C 2,52:1 Nicht bestanden

Aa #553E5B auf #6D8C4A 2,47:1 Nicht bestanden

Aa #928F8E auf #7B4136 2,47:1 Nicht bestanden

Aa #F8F8D1 auf #C59846 2,43:1 Nicht bestanden

Aa #6D8C4A auf #7B4136 2,07:1 Nicht bestanden

Aa #342121 auf #7B4136 1,91:1 Nicht bestanden

Aa #553E5B auf #342121 1,61:1 Nicht bestanden

Aa #4A443C auf #342121 1,58:1 Nicht bestanden

Aa #6D8C4A auf #C59846 1,45:1 Nicht bestanden

Aa #928F8E auf #C59846 1,22:1 Nicht bestanden

Aa #4A443C auf #7B4136 1,21:1 Nicht bestanden

Aa #553E5B auf #7B4136 1,19:1 Nicht bestanden

Aa #928F8E auf #6D8C4A 1,19:1 Nicht bestanden

Aa #553E5B auf #4A443C 1,02:1 Nicht bestanden

Pigment 🎨

Pigment 🎨

CSS-Variablen

Über diese Palette

Farben im Detail

Kontrast & Barrierefreiheit

Ähnliche Paletten

Schriftarten

Icons & SVG

Farben

Bilder

CSS-Tools

Entwicklung

Dokumentation

Unternehmen