Fadedpage12

Palette mit 12 Farben · Warm · Gemischt · Harmonie: Analog

Zurück zur Bibliothek

Fadedpage12

Palette mit 12 Farben · Temperatur: Warm · Ton: Gemischt · Harmonie: Analog

Bearbeiten

Erdig 12 Farben Warm Gemischt Analog warm soft old page

Likes 90

Farben 12

CSS-Variablen

:root {
  --c-earthy-1: #F7E5C8;
  --c-earthy-2: #E0C092;
  --c-earthy-3: #B88563;
  --c-earthy-4: #91554A;
  --c-earthy-5: #6E3838;
  --c-earthy-6: #42282E;
  --c-earthy-7: #80596F;
  --c-earthy-8: #6C7D8D;
  --c-earthy-9: #90A05E;
  --c-earthy-10: #C27070;
  --c-earthy-11: #D9A470;
  --c-earthy-12: #EAD874;
}

Über diese Palette

Diese erdige Palette mit 12 Farben reicht vom hellsten Ton Golden Buff (#F7E5C8) bis zum dunkelsten Ton Wenge Black (#42282E). Sie vereint Golden Buff, Dirty Blonde, Cognac Brown, Cogswell Cedar, Red Theatre, Wenge Black, Euphoric Magenta, Slate Expectations, Zesty Apple, Art House Pink, Western Sunrise und Golden Glitter Storm in einem Set, das du direkt in deine Benutzeroberfläche übernehmen kannst. Farbpaare in der Palette: 66. Davon erreichen 10 die WCAG-AA-Kontrastschwelle (4,5:1) für Fließtext – am stärksten ist #F7E5C8 auf #42282E mit 10,79: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

Golden Buff #F7E5C8

RGB: rgb(247, 229, 200)
HSL: hsl(37, 75%, 88%)
Luminanz: 0,800

Dirty Blonde #E0C092

RGB: rgb(224, 192, 146)
HSL: hsl(35, 56%, 73%)
Luminanz: 0,556

Cognac Brown #B88563

RGB: rgb(184, 133, 99)
HSL: hsl(24, 37%, 55%)
Luminanz: 0,279

Cogswell Cedar #91554A

RGB: rgb(145, 85, 74)
HSL: hsl(9, 32%, 43%)
Luminanz: 0,130

Red Theatre #6E3838

RGB: rgb(110, 56, 56)
HSL: hsl(0, 33%, 33%)
Luminanz: 0,064

Wenge Black #42282E

RGB: rgb(66, 40, 46)
HSL: hsl(346, 25%, 21%)
Luminanz: 0,029

Euphoric Magenta #80596F

RGB: rgb(128, 89, 111)
HSL: hsl(326, 18%, 43%)
Luminanz: 0,129

Slate Expectations #6C7D8D

RGB: rgb(108, 125, 141)
HSL: hsl(209, 13%, 49%)
Luminanz: 0,198

Zesty Apple #90A05E

RGB: rgb(144, 160, 94)
HSL: hsl(75, 26%, 50%)
Luminanz: 0,319

Art House Pink #C27070

RGB: rgb(194, 112, 112)
HSL: hsl(0, 40%, 60%)
Luminanz: 0,242

Western Sunrise #D9A470

RGB: rgb(217, 164, 112)
HSL: hsl(30, 58%, 65%)
Luminanz: 0,425

Golden Glitter Storm #EAD874

RGB: rgb(234, 216, 116)
HSL: hsl(51, 74%, 69%)
Luminanz: 0,679

Kontrast & Barrierefreiheit

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

Aa #F7E5C8 auf #42282E 10,79:1 AAA

Aa #42282E auf #EAD874 9,25:1 AAA

Aa #E0C092 auf #42282E 7,70:1 AAA

Aa #F7E5C8 auf #6E3838 7,44:1 AAA

Aa #6E3838 auf #EAD874 6,38:1 AA

Aa #42282E auf #D9A470 6,03:1 AA

Aa #E0C092 auf #6E3838 5,30:1 AA

Aa #F7E5C8 auf #80596F 4,75:1 AA

Aa #F7E5C8 auf #91554A 4,72:1 AA

Aa #42282E auf #90A05E 4,68:1 AA

Aa #B88563 auf #42282E 4,17:1 AA (großer Text)

Aa #6E3838 auf #D9A470 4,15:1 AA (großer Text)

Aa #80596F auf #EAD874 4,07:1 AA (großer Text)

Aa #91554A auf #EAD874 4,05:1 AA (großer Text)

Aa #42282E auf #C27070 3,71:1 AA (großer Text)

Aa #F7E5C8 auf #6C7D8D 3,43:1 AA (großer Text)

Aa #E0C092 auf #80596F 3,39:1 AA (großer Text)

Aa #E0C092 auf #91554A 3,37:1 AA (großer Text)

Aa #6E3838 auf #90A05E 3,23:1 AA (großer Text)

Aa #42282E auf #6C7D8D 3,15:1 AA (großer Text)

Aa #6C7D8D auf #EAD874 2,94:1 Nicht bestanden

Aa #F7E5C8 auf #C27070 2,91:1 Nicht bestanden

Aa #B88563 auf #6E3838 2,88:1 Nicht bestanden

Aa #80596F auf #D9A470 2,65:1 Nicht bestanden

Aa #91554A auf #D9A470 2,64:1 Nicht bestanden

Aa #F7E5C8 auf #B88563 2,59:1 Nicht bestanden

Aa #6E3838 auf #C27070 2,56:1 Nicht bestanden

Aa #C27070 auf #EAD874 2,49:1 Nicht bestanden

Aa #E0C092 auf #6C7D8D 2,45:1 Nicht bestanden

Aa #F7E5C8 auf #90A05E 2,30:1 Nicht bestanden

Aa #91554A auf #42282E 2,29:1 Nicht bestanden

Aa #42282E auf #80596F 2,27:1 Nicht bestanden

Aa #B88563 auf #EAD874 2,22:1 Nicht bestanden

Aa #6E3838 auf #6C7D8D 2,17:1 Nicht bestanden

Aa #E0C092 auf #C27070 2,07:1 Nicht bestanden

Aa #80596F auf #90A05E 2,06:1 Nicht bestanden

Aa #91554A auf #90A05E 2,05:1 Nicht bestanden

Aa #90A05E auf #EAD874 1,98:1 Nicht bestanden

Aa #6C7D8D auf #D9A470 1,92:1 Nicht bestanden

Aa #E0C092 auf #B88563 1,84:1 Nicht bestanden

Aa #B88563 auf #80596F 1,84:1 Nicht bestanden

Aa #B88563 auf #91554A 1,82:1 Nicht bestanden

Aa #F7E5C8 auf #D9A470 1,79:1 Nicht bestanden

Aa #E0C092 auf #90A05E 1,64:1 Nicht bestanden

Aa #80596F auf #C27070 1,63:1 Nicht bestanden

Aa #91554A auf #C27070 1,62:1 Nicht bestanden

Aa #C27070 auf #D9A470 1,62:1 Nicht bestanden

Aa #91554A auf #6E3838 1,58:1 Nicht bestanden

Aa #6E3838 auf #80596F 1,56:1 Nicht bestanden

Aa #D9A470 auf #EAD874 1,53:1 Nicht bestanden

Aa #6C7D8D auf #90A05E 1,49:1 Nicht bestanden

Aa #6E3838 auf #42282E 1,45:1 Nicht bestanden

Aa #B88563 auf #D9A470 1,44:1 Nicht bestanden

Aa #F7E5C8 auf #E0C092 1,40:1 Nicht bestanden

Aa #80596F auf #6C7D8D 1,39:1 Nicht bestanden

Aa #91554A auf #6C7D8D 1,38:1 Nicht bestanden

Aa #B88563 auf #6C7D8D 1,33:1 Nicht bestanden

Aa #90A05E auf #D9A470 1,29:1 Nicht bestanden

Aa #E0C092 auf #D9A470 1,28:1 Nicht bestanden

Aa #90A05E auf #C27070 1,26:1 Nicht bestanden

Aa #E0C092 auf #EAD874 1,20:1 Nicht bestanden

Aa #6C7D8D auf #C27070 1,18:1 Nicht bestanden

Aa #F7E5C8 auf #EAD874 1,17:1 Nicht bestanden

Aa #B88563 auf #90A05E 1,12:1 Nicht bestanden

Aa #B88563 auf #C27070 1,12:1 Nicht bestanden

Aa #91554A auf #80596F 1,01:1 Nicht bestanden

Fadedpage12

Fadedpage12

CSS-Variablen

Über diese Palette

Farben im Detail

Kontrast & Barrierefreiheit

Ähnliche Paletten

Schriftarten

Icons & SVG

Farben

Bilder

CSS-Tools

Entwicklung

Dokumentation

Unternehmen