8 Vision

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

Zurück zur Bibliothek

8 Vision

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

Bearbeiten

Erdig 8 Farben Warm Gemischt Komplementär computer msx

Likes 26

Farben 8

CSS-Variablen

:root {
  --c-earthy-1: #010101;
  --c-earthy-2: #3F38B3;
  --c-earthy-3: #A256A0;
  --c-earthy-4: #DB7962;
  --c-earthy-5: #EAD97F;
  --c-earthy-6: #FFFFFF;
  --c-earthy-7: #BBBBBB;
  --c-earthy-8: #4ABB7B;
}

Über diese Palette

Diese erdige Palette mit 8 Farben reicht vom hellsten Ton White (#FFFFFF) bis zum dunkelsten Ton Binary Black (#010101). Sie vereint Binary Black, Early Spring Night, Heath Spotted Orchid, Rich Georgia Clay, Celestial Crown, White, Gravel Fint und Esmeralda in einem Set, das du direkt in deine Benutzeroberfläche übernehmen kannst. Farbpaare in der Palette: 28. Davon erreichen 9 die WCAG-AA-Kontrastschwelle (4,5:1) für Fließtext – am stärksten ist #010101 auf #FFFFFF mit 20,87: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

Binary Black #010101

RGB: rgb(1, 1, 1)
HSL: hsl(0, 0%, 0%)
Luminanz: 0,000

Early Spring Night #3F38B3

RGB: rgb(63, 56, 179)
HSL: hsl(243, 52%, 46%)
Luminanz: 0,071

Heath Spotted Orchid #A256A0

RGB: rgb(162, 86, 160)
HSL: hsl(302, 31%, 49%)
Luminanz: 0,169

Rich Georgia Clay #DB7962

RGB: rgb(219, 121, 98)
HSL: hsl(11, 63%, 62%)
Luminanz: 0,296

Celestial Crown #EAD97F

RGB: rgb(234, 217, 127)
HSL: hsl(50, 72%, 71%)
Luminanz: 0,687

White #FFFFFF

RGB: rgb(255, 255, 255)
HSL: hsl(0, 0%, 100%)
Luminanz: 1,000

Gravel Fint #BBBBBB

RGB: rgb(187, 187, 187)
HSL: hsl(0, 0%, 73%)
Luminanz: 0,497

Esmeralda #4ABB7B

RGB: rgb(74, 187, 123)
HSL: hsl(146, 45%, 51%)
Luminanz: 0,384

Kontrast & Barrierefreiheit

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

Aa #010101 auf #FFFFFF 20,87:1 AAA

Aa #010101 auf #EAD97F 14,64:1 AAA

Aa #010101 auf #BBBBBB 10,87:1 AAA

Aa #3F38B3 auf #FFFFFF 8,65:1 AAA

Aa #010101 auf #4ABB7B 8,63:1 AAA

Aa #010101 auf #DB7962 6,88:1 AA

Aa #3F38B3 auf #EAD97F 6,07:1 AA

Aa #A256A0 auf #FFFFFF 4,80:1 AA

Aa #3F38B3 auf #BBBBBB 4,51:1 AA

Aa #010101 auf #A256A0 4,35:1 AA (großer Text)

Aa #3F38B3 auf #4ABB7B 3,58:1 AA (großer Text)

Aa #A256A0 auf #EAD97F 3,37:1 AA (großer Text)

Aa #DB7962 auf #FFFFFF 3,03:1 AA (großer Text)

Aa #3F38B3 auf #DB7962 2,85:1 Nicht bestanden

Aa #A256A0 auf #BBBBBB 2,50:1 Nicht bestanden

Aa #FFFFFF auf #4ABB7B 2,42:1 Nicht bestanden

Aa #010101 auf #3F38B3 2,41:1 Nicht bestanden

Aa #DB7962 auf #EAD97F 2,13:1 Nicht bestanden

Aa #A256A0 auf #4ABB7B 1,99:1 Nicht bestanden

Aa #FFFFFF auf #BBBBBB 1,92:1 Nicht bestanden

Aa #3F38B3 auf #A256A0 1,80:1 Nicht bestanden

Aa #EAD97F auf #4ABB7B 1,70:1 Nicht bestanden

Aa #A256A0 auf #DB7962 1,58:1 Nicht bestanden

Aa #DB7962 auf #BBBBBB 1,58:1 Nicht bestanden

Aa #EAD97F auf #FFFFFF 1,43:1 Nicht bestanden

Aa #EAD97F auf #BBBBBB 1,35:1 Nicht bestanden

Aa #BBBBBB auf #4ABB7B 1,26:1 Nicht bestanden

Aa #DB7962 auf #4ABB7B 1,25:1 Nicht bestanden

8 Vision

8 Vision

CSS-Variablen

Über diese Palette

Farben im Detail

Kontrast & Barrierefreiheit

Ähnliche Paletten

Schriftarten

Icons & SVG

Farben

Bilder

CSS-Tools

Entwicklung

Dokumentation

Unternehmen