Usefle 8

Palette mit 8 Farben · Kühl · Gemischt · Harmonie: Komplementär

Zurück zur Bibliothek

Usefle 8

Palette mit 8 Farben · Temperatur: Kühl · Ton: Gemischt · Harmonie: Komplementär

Bearbeiten

Erdig 8 Farben Kühl Gemischt Komplementär isasstudio

Likes 112

Farben 8

CSS-Variablen

:root {
  --c-earthy-1: #272237;
  --c-earthy-2: #4E3D6F;
  --c-earthy-3: #A9597A;
  --c-earthy-4: #6876A0;
  --c-earthy-5: #68C5B5;
  --c-earthy-6: #FF9E95;
  --c-earthy-7: #B8B6A4;
  --c-earthy-8: #F7F9E8;
}

Über diese Palette

Diese erdige Palette mit 8 Farben reicht vom hellsten Ton Soft Silver (#F7F9E8) bis zum dunkelsten Ton Cold Steel (#272237). Sie vereint Cold Steel, Succinct Violet, Indian Pink, Blue Batik, Miami Teal, Peach Amber, Afternoon Nap und Soft Silver in einem Set, das du direkt in deine Benutzeroberfläche übernehmen kannst. Farbpaare in der Palette: 28. Davon erreichen 8 die WCAG-AA-Kontrastschwelle (4,5:1) für Fließtext – am stärksten ist #272237 auf #F7F9E8 mit 14,36: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

Cold Steel #272237

RGB: rgb(39, 34, 55)
HSL: hsl(254, 24%, 17%)
Luminanz: 0,019

Succinct Violet #4E3D6F

RGB: rgb(78, 61, 111)
HSL: hsl(260, 29%, 34%)
Luminanz: 0,061

Indian Pink #A9597A

RGB: rgb(169, 89, 122)
HSL: hsl(335, 32%, 51%)
Luminanz: 0,170

Blue Batik #6876A0

RGB: rgb(104, 118, 160)
HSL: hsl(225, 23%, 52%)
Luminanz: 0,184

Miami Teal #68C5B5

RGB: rgb(104, 197, 181)
HSL: hsl(170, 44%, 59%)
Luminanz: 0,462

Peach Amber #FF9E95

RGB: rgb(255, 158, 149)
HSL: hsl(5, 100%, 79%)
Luminanz: 0,479

Afternoon Nap #B8B6A4

RGB: rgb(184, 182, 164)
HSL: hsl(54, 12%, 68%)
Luminanz: 0,463

Soft Silver #F7F9E8

RGB: rgb(247, 249, 232)
HSL: hsl(67, 59%, 94%)
Luminanz: 0,934

Kontrast & Barrierefreiheit

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

Aa #272237 auf #F7F9E8 14,36:1 AAA

Aa #4E3D6F auf #F7F9E8 8,86:1 AAA

Aa #272237 auf #FF9E95 7,72:1 AAA

Aa #272237 auf #B8B6A4 7,49:1 AAA

Aa #272237 auf #68C5B5 7,47:1 AAA

Aa #4E3D6F auf #FF9E95 4,76:1 AA

Aa #4E3D6F auf #B8B6A4 4,62:1 AA

Aa #4E3D6F auf #68C5B5 4,61:1 AA

Aa #A9597A auf #F7F9E8 4,47:1 AA (großer Text)

Aa #6876A0 auf #F7F9E8 4,20:1 AA (großer Text)

Aa #272237 auf #6876A0 3,42:1 AA (großer Text)

Aa #272237 auf #A9597A 3,21:1 AA (großer Text)

Aa #A9597A auf #FF9E95 2,41:1 Nicht bestanden

Aa #A9597A auf #68C5B5 2,33:1 Nicht bestanden

Aa #A9597A auf #B8B6A4 2,33:1 Nicht bestanden

Aa #6876A0 auf #FF9E95 2,26:1 Nicht bestanden

Aa #6876A0 auf #B8B6A4 2,19:1 Nicht bestanden

Aa #6876A0 auf #68C5B5 2,18:1 Nicht bestanden

Aa #4E3D6F auf #6876A0 2,11:1 Nicht bestanden

Aa #4E3D6F auf #A9597A 1,98:1 Nicht bestanden

Aa #68C5B5 auf #F7F9E8 1,92:1 Nicht bestanden

Aa #B8B6A4 auf #F7F9E8 1,92:1 Nicht bestanden

Aa #FF9E95 auf #F7F9E8 1,86:1 Nicht bestanden

Aa #272237 auf #4E3D6F 1,62:1 Nicht bestanden

Aa #A9597A auf #6876A0 1,07:1 Nicht bestanden

Aa #68C5B5 auf #FF9E95 1,03:1 Nicht bestanden

Aa #FF9E95 auf #B8B6A4 1,03:1 Nicht bestanden

Aa #68C5B5 auf #B8B6A4 1,00:1 Nicht bestanden

Usefle 8

Usefle 8

CSS-Variablen

Über diese Palette

Farben im Detail

Kontrast & Barrierefreiheit

Ähnliche Paletten

Schriftarten

Icons & SVG

Farben

Bilder

CSS-Tools

Entwicklung

Dokumentation

Unternehmen