CliffCamp

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

Zurück zur Bibliothek

CliffCamp

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

Bearbeiten

Erdig 12 Farben Warm Gemischt Komplementär muted desert cozy

Likes 53

Farben 12

CSS-Variablen

:root {
  --c-earthy-1: #E1CC9D;
  --c-earthy-2: #9C5B3E;
  --c-earthy-3: #2A201E;
  --c-earthy-4: #344456;
  --c-earthy-5: #4C7554;
  --c-earthy-6: #94B85A;
  --c-earthy-7: #573139;
  --c-earthy-8: #9B3644;
  --c-earthy-9: #D65743;
  --c-earthy-10: #65B8BA;
  --c-earthy-11: #486983;
  --c-earthy-12: #CBA146;
}

Über diese Palette

Diese erdige Palette mit 12 Farben reicht vom hellsten Ton Prairie Land (#E1CC9D) bis zum dunkelsten Ton Orka Black (#2A201E). Sie vereint Prairie Land, Chocolate Fountain, Orka Black, Aristocratic Blue, Killarney, Happy Tune, Nectar of the Gods, High Drama, Scarlet Sun, Fresh Soft Blue, Eames for Blue und Golden Touch in einem Set, das du direkt in deine Benutzeroberfläche übernehmen kannst. Farbpaare in der Palette: 66. Davon erreichen 9 die WCAG-AA-Kontrastschwelle (4,5:1) für Fließtext – am stärksten ist #E1CC9D auf #2A201E mit 10,07: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

Prairie Land #E1CC9D

RGB: rgb(225, 204, 157)
HSL: hsl(41, 53%, 75%)
Luminanz: 0,616

Chocolate Fountain #9C5B3E

RGB: rgb(156, 91, 62)
HSL: hsl(19, 43%, 43%)
Luminanz: 0,149

Orka Black #2A201E

RGB: rgb(42, 32, 30)
HSL: hsl(10, 17%, 14%)
Luminanz: 0,016

Aristocratic Blue #344456

RGB: rgb(52, 68, 86)
HSL: hsl(212, 25%, 27%)
Luminanz: 0,055

Killarney #4C7554

RGB: rgb(76, 117, 84)
HSL: hsl(132, 21%, 38%)
Luminanz: 0,149

Happy Tune #94B85A

RGB: rgb(148, 184, 90)
HSL: hsl(83, 40%, 54%)
Luminanz: 0,413

Nectar of the Gods #573139

RGB: rgb(87, 49, 57)
HSL: hsl(347, 28%, 27%)
Luminanz: 0,045

High Drama #9B3644

RGB: rgb(155, 54, 68)
HSL: hsl(352, 48%, 41%)
Luminanz: 0,100

Scarlet Sun #D65743

RGB: rgb(214, 87, 67)
HSL: hsl(8, 64%, 55%)
Luminanz: 0,215

Fresh Soft Blue #65B8BA

RGB: rgb(101, 184, 186)
HSL: hsl(181, 38%, 56%)
Luminanz: 0,406

Eames for Blue #486983

RGB: rgb(72, 105, 131)
HSL: hsl(206, 29%, 40%)
Luminanz: 0,131

Golden Touch #CBA146

RGB: rgb(203, 161, 70)
HSL: hsl(41, 56%, 54%)
Luminanz: 0,386

Kontrast & Barrierefreiheit

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

Aa #E1CC9D auf #2A201E 10,07:1 AAA

Aa #E1CC9D auf #573139 7,00:1 AAA

Aa #2A201E auf #94B85A 7,00:1 AAA

Aa #2A201E auf #65B8BA 6,89:1 AA

Aa #2A201E auf #CBA146 6,59:1 AA

Aa #E1CC9D auf #344456 6,32:1 AA

Aa #94B85A auf #573139 4,87:1 AA

Aa #573139 auf #65B8BA 4,79:1 AA

Aa #573139 auf #CBA146 4,58:1 AA

Aa #E1CC9D auf #9B3644 4,43:1 AA (großer Text)

Aa #344456 auf #94B85A 4,40:1 AA (großer Text)

Aa #344456 auf #65B8BA 4,33:1 AA (großer Text)

Aa #344456 auf #CBA146 4,14:1 AA (großer Text)

Aa #2A201E auf #D65743 4,01:1 AA (großer Text)

Aa #E1CC9D auf #486983 3,68:1 AA (großer Text)

Aa #E1CC9D auf #9C5B3E 3,35:1 AA (großer Text)

Aa #E1CC9D auf #4C7554 3,35:1 AA (großer Text)

Aa #94B85A auf #9B3644 3,08:1 AA (großer Text)

Aa #9B3644 auf #65B8BA 3,03:1 AA (großer Text)

Aa #9C5B3E auf #2A201E 3,01:1 AA (großer Text)

Aa #2A201E auf #4C7554 3,01:1 AA (großer Text)

Aa #9B3644 auf #CBA146 2,90:1 Nicht bestanden

Aa #573139 auf #D65743 2,79:1 Nicht bestanden

Aa #2A201E auf #486983 2,74:1 Nicht bestanden

Aa #94B85A auf #486983 2,56:1 Nicht bestanden

Aa #344456 auf #D65743 2,52:1 Nicht bestanden

Aa #65B8BA auf #486983 2,52:1 Nicht bestanden

Aa #E1CC9D auf #D65743 2,51:1 Nicht bestanden

Aa #486983 auf #CBA146 2,41:1 Nicht bestanden

Aa #9C5B3E auf #94B85A 2,33:1 Nicht bestanden

Aa #4C7554 auf #94B85A 2,33:1 Nicht bestanden

Aa #9C5B3E auf #65B8BA 2,29:1 Nicht bestanden

Aa #4C7554 auf #65B8BA 2,29:1 Nicht bestanden

Aa #2A201E auf #9B3644 2,27:1 Nicht bestanden

Aa #9C5B3E auf #CBA146 2,19:1 Nicht bestanden

Aa #4C7554 auf #CBA146 2,19:1 Nicht bestanden

Aa #9C5B3E auf #573139 2,09:1 Nicht bestanden

Aa #4C7554 auf #573139 2,09:1 Nicht bestanden

Aa #573139 auf #486983 1,90:1 Nicht bestanden

Aa #9C5B3E auf #344456 1,89:1 Nicht bestanden

Aa #344456 auf #4C7554 1,89:1 Nicht bestanden

Aa #9B3644 auf #D65743 1,76:1 Nicht bestanden

Aa #94B85A auf #D65743 1,75:1 Nicht bestanden

Aa #344456 auf #486983 1,72:1 Nicht bestanden

Aa #D65743 auf #65B8BA 1,72:1 Nicht bestanden

Aa #D65743 auf #CBA146 1,65:1 Nicht bestanden

Aa #2A201E auf #344456 1,59:1 Nicht bestanden

Aa #573139 auf #9B3644 1,58:1 Nicht bestanden

Aa #E1CC9D auf #CBA146 1,53:1 Nicht bestanden

Aa #E1CC9D auf #65B8BA 1,46:1 Nicht bestanden

Aa #D65743 auf #486983 1,46:1 Nicht bestanden

Aa #E1CC9D auf #94B85A 1,44:1 Nicht bestanden

Aa #2A201E auf #573139 1,44:1 Nicht bestanden

Aa #344456 auf #9B3644 1,43:1 Nicht bestanden

Aa #9C5B3E auf #D65743 1,33:1 Nicht bestanden

Aa #4C7554 auf #D65743 1,33:1 Nicht bestanden

Aa #9C5B3E auf #9B3644 1,32:1 Nicht bestanden

Aa #4C7554 auf #9B3644 1,32:1 Nicht bestanden

Aa #9B3644 auf #486983 1,21:1 Nicht bestanden

Aa #344456 auf #573139 1,11:1 Nicht bestanden

Aa #9C5B3E auf #486983 1,10:1 Nicht bestanden

Aa #4C7554 auf #486983 1,10:1 Nicht bestanden

Aa #94B85A auf #CBA146 1,06:1 Nicht bestanden

Aa #65B8BA auf #CBA146 1,05:1 Nicht bestanden

Aa #94B85A auf #65B8BA 1,02:1 Nicht bestanden

Aa #9C5B3E auf #4C7554 1,00:1 Nicht bestanden

CliffCamp

CliffCamp

CSS-Variablen

Über diese Palette

Farben im Detail

Kontrast & Barrierefreiheit

Ähnliche Paletten

Schriftarten

Icons & SVG

Farben

Bilder

CSS-Tools

Entwicklung

Dokumentation

Unternehmen