Melon 8

Palette mit 8 Farben · Warm · Gemischt · Harmonie: Analog

Zurück zur Bibliothek

Melon 8

Palette mit 8 Farben · Temperatur: Warm · Ton: Gemischt · Harmonie: Analog

Bearbeiten

Erdig 8 Farben Warm Gemischt Analog watermelon melon

Likes 19

Farben 8

CSS-Variablen

:root {
  --c-earthy-1: #231F20;
  --c-earthy-2: #6F3228;
  --c-earthy-3: #BB4430;
  --c-earthy-4: #D59587;
  --c-earthy-5: #EFE6DD;
  --c-earthy-6: #ADC79A;
  --c-earthy-7: #6AA856;
  --c-earthy-8: #47643B;
}

Über diese Palette

Diese erdige Palette mit 8 Farben reicht vom hellsten Ton White Linen (#EFE6DD) bis zum dunkelsten Ton Abaddon Black (#231F20). Sie vereint Abaddon Black, Cypress Bark Red, Browned Off, Peach Preserve, White Linen, Geddy Green, Techno Green und Plasticine in einem Set, das du direkt in deine Benutzeroberfläche übernehmen kannst. Farbpaare in der Palette: 28. Davon erreichen 7 die WCAG-AA-Kontrastschwelle (4,5:1) für Fließtext – am stärksten ist #231F20 auf #EFE6DD mit 13,22: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

Abaddon Black #231F20

RGB: rgb(35, 31, 32)
HSL: hsl(345, 6%, 13%)
Luminanz: 0,014

Cypress Bark Red #6F3228

RGB: rgb(111, 50, 40)
HSL: hsl(8, 47%, 30%)
Luminanz: 0,058

Browned Off #BB4430

RGB: rgb(187, 68, 48)
HSL: hsl(9, 59%, 46%)
Luminanz: 0,149

Peach Preserve #D59587

RGB: rgb(213, 149, 135)
HSL: hsl(11, 48%, 68%)
Luminanz: 0,374

White Linen #EFE6DD

RGB: rgb(239, 230, 221)
HSL: hsl(30, 36%, 90%)
Luminanz: 0,802

Geddy Green #ADC79A

RGB: rgb(173, 199, 154)
HSL: hsl(95, 29%, 69%)
Luminanz: 0,521

Techno Green #6AA856

RGB: rgb(106, 168, 86)
HSL: hsl(105, 32%, 50%)
Luminanz: 0,317

Plasticine #47643B

RGB: rgb(71, 100, 59)
HSL: hsl(102, 26%, 31%)
Luminanz: 0,108

Kontrast & Barrierefreiheit

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

Aa #231F20 auf #EFE6DD 13,22:1 AAA

Aa #231F20 auf #ADC79A 8,86:1 AAA

Aa #6F3228 auf #EFE6DD 7,88:1 AAA

Aa #231F20 auf #D59587 6,58:1 AA

Aa #231F20 auf #6AA856 5,70:1 AA

Aa #EFE6DD auf #47643B 5,40:1 AA

Aa #6F3228 auf #ADC79A 5,28:1 AA

Aa #BB4430 auf #EFE6DD 4,28:1 AA (großer Text)

Aa #6F3228 auf #D59587 3,92:1 AA (großer Text)

Aa #ADC79A auf #47643B 3,62:1 AA (großer Text)

Aa #6F3228 auf #6AA856 3,40:1 AA (großer Text)

Aa #231F20 auf #BB4430 3,09:1 AA (großer Text)

Aa #BB4430 auf #ADC79A 2,87:1 Nicht bestanden

Aa #D59587 auf #47643B 2,69:1 Nicht bestanden

Aa #231F20 auf #47643B 2,45:1 Nicht bestanden

Aa #6AA856 auf #47643B 2,33:1 Nicht bestanden

Aa #EFE6DD auf #6AA856 2,32:1 Nicht bestanden

Aa #BB4430 auf #D59587 2,13:1 Nicht bestanden

Aa #D59587 auf #EFE6DD 2,01:1 Nicht bestanden

Aa #BB4430 auf #6AA856 1,85:1 Nicht bestanden

Aa #6F3228 auf #BB4430 1,84:1 Nicht bestanden

Aa #231F20 auf #6F3228 1,68:1 Nicht bestanden

Aa #ADC79A auf #6AA856 1,55:1 Nicht bestanden

Aa #EFE6DD auf #ADC79A 1,49:1 Nicht bestanden

Aa #6F3228 auf #47643B 1,46:1 Nicht bestanden

Aa #D59587 auf #ADC79A 1,35:1 Nicht bestanden

Aa #BB4430 auf #47643B 1,26:1 Nicht bestanden

Aa #D59587 auf #6AA856 1,15:1 Nicht bestanden

Melon 8

Melon 8

CSS-Variablen

Über diese Palette

Farben im Detail

Kontrast & Barrierefreiheit

Ähnliche Paletten

Schriftarten

Icons & SVG

Farben

Bilder

CSS-Tools

Entwicklung

Dokumentation

Unternehmen