Gated

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

Zurück zur Bibliothek

Gated

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

Bearbeiten

Erdig 9 Farben Warm Gemischt Komplementär scifi nostalgia tv stargate

Likes 26

Farben 9

CSS-Variablen

:root {
  --c-earthy-1: #F5F9FF;
  --c-earthy-2: #5A7598;
  --c-earthy-3: #3E3785;
  --c-earthy-4: #17082C;
  --c-earthy-5: #59422F;
  --c-earthy-6: #766047;
  --c-earthy-7: #AA8F72;
  --c-earthy-8: #E0AA07;
  --c-earthy-9: #833C27;
}

Über diese Palette

Diese erdige Palette mit 9 Farben reicht vom hellsten Ton Mā White (#F5F9FF) bis zum dunkelsten Ton Quiet Abyss (#17082C). Sie vereint Mā White, Privileged Elite, Majestic Eggplant, Quiet Abyss, Garden Loam, Woodward Park, Café Américaine, Mustard Yellow und Grill Master in einem Set, das du direkt in deine Benutzeroberfläche übernehmen kannst. Farbpaare in der Palette: 36. Davon erreichen 8 die WCAG-AA-Kontrastschwelle (4,5:1) für Fließtext – am stärksten ist #F5F9FF auf #17082C mit 17,95: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

Mā White #F5F9FF

RGB: rgb(245, 249, 255)
HSL: hsl(216, 100%, 98%)
Luminanz: 0,944

Privileged Elite #5A7598

RGB: rgb(90, 117, 152)
HSL: hsl(214, 26%, 47%)
Luminanz: 0,172

Majestic Eggplant #3E3785

RGB: rgb(62, 55, 133)
HSL: hsl(245, 41%, 37%)
Luminanz: 0,055

Quiet Abyss #17082C

RGB: rgb(23, 8, 44)
HSL: hsl(265, 69%, 10%)
Luminanz: 0,005

Garden Loam #59422F

RGB: rgb(89, 66, 47)
HSL: hsl(27, 31%, 27%)
Luminanz: 0,062

Woodward Park #766047

RGB: rgb(118, 96, 71)
HSL: hsl(32, 25%, 37%)
Luminanz: 0,127

Café Américaine #AA8F72

RGB: rgb(170, 143, 114)
HSL: hsl(31, 25%, 56%)
Luminanz: 0,294

Mustard Yellow #E0AA07

RGB: rgb(224, 170, 7)
HSL: hsl(45, 94%, 45%)
Luminanz: 0,446

Grill Master #833C27

RGB: rgb(131, 60, 39)
HSL: hsl(14, 54%, 33%)
Luminanz: 0,082

Kontrast & Barrierefreiheit

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

Aa #F5F9FF auf #17082C 17,95:1 AAA

Aa #F5F9FF auf #3E3785 9,51:1 AAA

Aa #17082C auf #E0AA07 8,96:1 AAA

Aa #F5F9FF auf #59422F 8,85:1 AAA

Aa #F5F9FF auf #833C27 7,53:1 AAA

Aa #17082C auf #AA8F72 6,21:1 AA

Aa #F5F9FF auf #766047 5,62:1 AA

Aa #3E3785 auf #E0AA07 4,75:1 AA

Aa #F5F9FF auf #5A7598 4,48:1 AA (großer Text)

Aa #59422F auf #E0AA07 4,42:1 AA (großer Text)

Aa #5A7598 auf #17082C 4,00:1 AA (großer Text)

Aa #E0AA07 auf #833C27 3,76:1 AA (großer Text)

Aa #3E3785 auf #AA8F72 3,29:1 AA (großer Text)

Aa #17082C auf #766047 3,19:1 AA (großer Text)

Aa #59422F auf #AA8F72 3,06:1 AA (großer Text)

Aa #F5F9FF auf #AA8F72 2,89:1 Nicht bestanden

Aa #766047 auf #E0AA07 2,81:1 Nicht bestanden

Aa #AA8F72 auf #833C27 2,61:1 Nicht bestanden

Aa #17082C auf #833C27 2,38:1 Nicht bestanden

Aa #5A7598 auf #E0AA07 2,24:1 Nicht bestanden

Aa #5A7598 auf #3E3785 2,12:1 Nicht bestanden

Aa #17082C auf #59422F 2,03:1 Nicht bestanden

Aa #F5F9FF auf #E0AA07 2,00:1 Nicht bestanden

Aa #5A7598 auf #59422F 1,97:1 Nicht bestanden

Aa #766047 auf #AA8F72 1,95:1 Nicht bestanden

Aa #3E3785 auf #17082C 1,89:1 Nicht bestanden

Aa #3E3785 auf #766047 1,69:1 Nicht bestanden

Aa #5A7598 auf #833C27 1,68:1 Nicht bestanden

Aa #59422F auf #766047 1,57:1 Nicht bestanden

Aa #5A7598 auf #AA8F72 1,55:1 Nicht bestanden

Aa #AA8F72 auf #E0AA07 1,44:1 Nicht bestanden

Aa #766047 auf #833C27 1,34:1 Nicht bestanden

Aa #3E3785 auf #833C27 1,26:1 Nicht bestanden

Aa #5A7598 auf #766047 1,25:1 Nicht bestanden

Aa #59422F auf #833C27 1,18:1 Nicht bestanden

Aa #3E3785 auf #59422F 1,07:1 Nicht bestanden

Gated

Gated

CSS-Variablen

Über diese Palette

Farben im Detail

Kontrast & Barrierefreiheit

Ähnliche Paletten

Schriftarten

Icons & SVG

Farben

Bilder

CSS-Tools

Entwicklung

Dokumentation

Unternehmen