Startseite Farbpaletten [blank] Canvas

[blank] Canvas

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

Zurück zur Bibliothek

[blank] Canvas

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

Bearbeiten

Erdig 7 Farben Warm Gemischt Komplementär

Likes 7

Farben 7

CSS-Variablen

:root {
  --c-earthy-1: #FFFFFF;
  --c-earthy-2: #000000;
  --c-earthy-3: #F44336;
  --c-earthy-4: #FF9800;
  --c-earthy-5: #4CAF50;
  --c-earthy-6: #3F51B5;
  --c-earthy-7: #BA68C8;
}

Über diese Palette

Diese erdige Palette mit 7 Farben reicht vom hellsten Ton White (#FFFFFF) bis zum dunkelsten Ton Black (#000000). Sie vereint White, Black, Vermilion Bird, Vitamin C, Devil’s Grass, Night in Manchester und Rich Lilac in einem Set, das du direkt in deine Benutzeroberfläche übernehmen kannst. Farbpaare in der Palette: 21. Davon erreichen 6 die WCAG-AA-Kontrastschwelle (4,5:1) für Fließtext – am stärksten ist #FFFFFF auf #000000 mit 21: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

White #FFFFFF

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

Black #000000

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

Vermilion Bird #F44336

RGB: rgb(244, 67, 54)
HSL: hsl(4, 90%, 58%)
Luminanz: 0,235

Vitamin C #FF9800

RGB: rgb(255, 152, 0)
HSL: hsl(36, 100%, 50%)
Luminanz: 0,437

Devil’s Grass #4CAF50

RGB: rgb(76, 175, 80)
HSL: hsl(122, 39%, 49%)
Luminanz: 0,328

Night in Manchester #3F51B5

RGB: rgb(63, 81, 181)
HSL: hsl(231, 48%, 48%)
Luminanz: 0,103

Rich Lilac #BA68C8

RGB: rgb(186, 104, 200)
HSL: hsl(291, 47%, 60%)
Luminanz: 0,245

Kontrast & Barrierefreiheit

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

Aa #FFFFFF auf #000000 21,00:1 AAA

Aa #000000 auf #FF9800 9,74:1 AAA

Aa #000000 auf #4CAF50 7,56:1 AAA

Aa #FFFFFF auf #3F51B5 6,87:1 AA

Aa #000000 auf #BA68C8 5,90:1 AA

Aa #000000 auf #F44336 5,70:1 AA

Aa #FFFFFF auf #F44336 3,68:1 AA (großer Text)

Aa #FFFFFF auf #BA68C8 3,56:1 AA (großer Text)

Aa #FF9800 auf #3F51B5 3,19:1 AA (großer Text)

Aa #000000 auf #3F51B5 3,06:1 AA (großer Text)

Aa #FFFFFF auf #4CAF50 2,78:1 Nicht bestanden

Aa #4CAF50 auf #3F51B5 2,47:1 Nicht bestanden

Aa #FFFFFF auf #FF9800 2,16:1 Nicht bestanden

Aa #3F51B5 auf #BA68C8 1,93:1 Nicht bestanden

Aa #F44336 auf #3F51B5 1,87:1 Nicht bestanden

Aa #F44336 auf #FF9800 1,71:1 Nicht bestanden

Aa #FF9800 auf #BA68C8 1,65:1 Nicht bestanden

Aa #F44336 auf #4CAF50 1,32:1 Nicht bestanden

Aa #FF9800 auf #4CAF50 1,29:1 Nicht bestanden

Aa #4CAF50 auf #BA68C8 1,28:1 Nicht bestanden

Aa #F44336 auf #BA68C8 1,03:1 Nicht bestanden

[blank] Canvas

[blank] Canvas

CSS-Variablen

Über diese Palette

Farben im Detail

Kontrast & Barrierefreiheit

Ähnliche Paletten

Schriftarten

Icons & SVG

Farben

Bilder

CSS-Tools

Entwicklung

Dokumentation

Unternehmen