SweetHope

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

Zurück zur Bibliothek

SweetHope

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

Bearbeiten

Erdig 8 Farben Kühl Hell Komplementär artist pastel 8 saturated

Likes 382

Farben 8

CSS-Variablen

:root {
  --c-earthy-1: #615E85;
  --c-earthy-2: #9C8DC2;
  --c-earthy-3: #D9A3CD;
  --c-earthy-4: #EBC3A7;
  --c-earthy-5: #E0E0DC;
  --c-earthy-6: #A3D1AF;
  --c-earthy-7: #90B4DE;
  --c-earthy-8: #717FB0;
}

Über diese Palette

Diese erdige Palette mit 8 Farben reicht vom hellsten Ton City Brume (#E0E0DC) bis zum dunkelsten Ton Purple Balloon (#615E85). Sie vereint Purple Balloon, Hermosa, Chateau Rose, Alesan, City Brume, Merrylyn, Echo Isles Water und Venture Violet in einem Set, das du direkt in deine Benutzeroberfläche übernehmen kannst. Farbpaare in der Palette: 28. Davon erreicht 1 die WCAG-AA-Kontrastschwelle (4,5:1) für Fließtext – am stärksten ist #615E85 auf #E0E0DC mit 4,6: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

Purple Balloon #615E85

RGB: rgb(97, 94, 133)
HSL: hsl(245, 17%, 45%)
Luminanz: 0,122

Hermosa #9C8DC2

RGB: rgb(156, 141, 194)
HSL: hsl(257, 30%, 66%)
Luminanz: 0,300

Chateau Rose #D9A3CD

RGB: rgb(217, 163, 205)
HSL: hsl(313, 42%, 75%)
Luminanz: 0,454

Alesan #EBC3A7

RGB: rgb(235, 195, 167)
HSL: hsl(25, 63%, 79%)
Luminanz: 0,595

City Brume #E0E0DC

RGB: rgb(224, 224, 220)
HSL: hsl(60, 6%, 87%)
Luminanz: 0,743

Merrylyn #A3D1AF

RGB: rgb(163, 209, 175)
HSL: hsl(136, 33%, 73%)
Luminanz: 0,565

Echo Isles Water #90B4DE

RGB: rgb(144, 180, 222)
HSL: hsl(212, 54%, 72%)
Luminanz: 0,439

Venture Violet #717FB0

RGB: rgb(113, 127, 176)
HSL: hsl(227, 29%, 57%)
Luminanz: 0,218

Kontrast & Barrierefreiheit

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

Aa #615E85 auf #E0E0DC 4,60:1 AA

Aa #615E85 auf #EBC3A7 3,74:1 AA (großer Text)

Aa #615E85 auf #A3D1AF 3,57:1 AA (großer Text)

Aa #E0E0DC auf #717FB0 2,96:1 Nicht bestanden

Aa #615E85 auf #D9A3CD 2,92:1 Nicht bestanden

Aa #615E85 auf #90B4DE 2,83:1 Nicht bestanden

Aa #EBC3A7 auf #717FB0 2,40:1 Nicht bestanden

Aa #A3D1AF auf #717FB0 2,29:1 Nicht bestanden

Aa #9C8DC2 auf #E0E0DC 2,27:1 Nicht bestanden

Aa #615E85 auf #9C8DC2 2,03:1 Nicht bestanden

Aa #D9A3CD auf #717FB0 1,88:1 Nicht bestanden

Aa #9C8DC2 auf #EBC3A7 1,84:1 Nicht bestanden

Aa #90B4DE auf #717FB0 1,82:1 Nicht bestanden

Aa #9C8DC2 auf #A3D1AF 1,76:1 Nicht bestanden

Aa #E0E0DC auf #90B4DE 1,62:1 Nicht bestanden

Aa #D9A3CD auf #E0E0DC 1,58:1 Nicht bestanden

Aa #615E85 auf #717FB0 1,56:1 Nicht bestanden

Aa #9C8DC2 auf #D9A3CD 1,44:1 Nicht bestanden

Aa #9C8DC2 auf #90B4DE 1,40:1 Nicht bestanden

Aa #EBC3A7 auf #90B4DE 1,32:1 Nicht bestanden

Aa #9C8DC2 auf #717FB0 1,31:1 Nicht bestanden

Aa #E0E0DC auf #A3D1AF 1,29:1 Nicht bestanden

Aa #D9A3CD auf #EBC3A7 1,28:1 Nicht bestanden

Aa #A3D1AF auf #90B4DE 1,26:1 Nicht bestanden

Aa #EBC3A7 auf #E0E0DC 1,23:1 Nicht bestanden

Aa #D9A3CD auf #A3D1AF 1,22:1 Nicht bestanden

Aa #EBC3A7 auf #A3D1AF 1,05:1 Nicht bestanden

Aa #D9A3CD auf #90B4DE 1,03:1 Nicht bestanden

SweetHope

SweetHope

CSS-Variablen

Über diese Palette

Farben im Detail

Kontrast & Barrierefreiheit

Ähnliche Paletten

Schriftarten

Icons & SVG

Farben

Bilder

CSS-Tools

Entwicklung

Dokumentation

Unternehmen