Calm Sunset

Palette mit 7 Farben · Warm · Hell · Harmonie: Triadisch

Zurück zur Bibliothek

Calm Sunset

Palette mit 7 Farben · Temperatur: Warm · Ton: Hell · Harmonie: Triadisch

Bearbeiten

Lebendig 7 Farben Warm Hell Triadisch sky clouds sunset calm

Likes 570

Farben 7

CSS-Variablen

:root {
  --c-vibrant-1: #684971;
  --c-vibrant-2: #A06389;
  --c-vibrant-3: #CB7CA2;
  --c-vibrant-4: #E1AEA4;
  --c-vibrant-5: #F9D8A1;
  --c-vibrant-6: #FFECB2;
  --c-vibrant-7: #FFFCF1;
}

Über diese Palette

Diese lebendige Palette mit 7 Farben reicht vom hellsten Ton Granulated Sugar (#FFFCF1) bis zum dunkelsten Ton Clary (#684971). Sie vereint Clary, Raspberry Jelly Red, Heartbreaker, Pale Blush, Milky Maize, Dear Melissa und Granulated Sugar in einem Set, das du direkt in deine Benutzeroberfläche übernehmen kannst. Farbpaare in der Palette: 21. Davon erreichen 3 die WCAG-AA-Kontrastschwelle (4,5:1) für Fließtext – am stärksten ist #684971 auf #FFFCF1 mit 7,35:1.

Eine vielseitige Palette für Marketingseiten, Hero-Blöcke von Produkten, Illustrationen und Akzentzustände in der UI.

Farben im Detail

Clary #684971

RGB: rgb(104, 73, 113)
HSL: hsl(287, 22%, 36%)
Luminanz: 0,089

Raspberry Jelly Red #A06389

RGB: rgb(160, 99, 137)
HSL: hsl(323, 24%, 51%)
Luminanz: 0,182

Heartbreaker #CB7CA2

RGB: rgb(203, 124, 162)
HSL: hsl(331, 43%, 64%)
Luminanz: 0,297

Pale Blush #E1AEA4

RGB: rgb(225, 174, 164)
HSL: hsl(10, 50%, 76%)
Luminanz: 0,490

Milky Maize #F9D8A1

RGB: rgb(249, 216, 161)
HSL: hsl(38, 88%, 80%)
Luminanz: 0,718

Dear Melissa #FFECB2

RGB: rgb(255, 236, 178)
HSL: hsl(45, 100%, 85%)
Luminanz: 0,845

Granulated Sugar #FFFCF1

RGB: rgb(255, 252, 241)
HSL: hsl(47, 100%, 97%)
Luminanz: 0,972

Kontrast & Barrierefreiheit

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

Aa #684971 auf #FFFCF1 7,35:1 AAA

Aa #684971 auf #FFECB2 6,44:1 AA

Aa #684971 auf #F9D8A1 5,53:1 AA

Aa #A06389 auf #FFFCF1 4,41:1 AA (großer Text)

Aa #684971 auf #E1AEA4 3,88:1 AA (großer Text)

Aa #A06389 auf #FFECB2 3,86:1 AA (großer Text)

Aa #A06389 auf #F9D8A1 3,31:1 AA (großer Text)

Aa #CB7CA2 auf #FFFCF1 2,94:1 Nicht bestanden

Aa #CB7CA2 auf #FFECB2 2,58:1 Nicht bestanden

Aa #684971 auf #CB7CA2 2,50:1 Nicht bestanden

Aa #A06389 auf #E1AEA4 2,33:1 Nicht bestanden

Aa #CB7CA2 auf #F9D8A1 2,21:1 Nicht bestanden

Aa #E1AEA4 auf #FFFCF1 1,89:1 Nicht bestanden

Aa #684971 auf #A06389 1,67:1 Nicht bestanden

Aa #E1AEA4 auf #FFECB2 1,66:1 Nicht bestanden

Aa #CB7CA2 auf #E1AEA4 1,55:1 Nicht bestanden

Aa #A06389 auf #CB7CA2 1,50:1 Nicht bestanden

Aa #E1AEA4 auf #F9D8A1 1,42:1 Nicht bestanden

Aa #F9D8A1 auf #FFFCF1 1,33:1 Nicht bestanden

Aa #F9D8A1 auf #FFECB2 1,16:1 Nicht bestanden

Aa #FFECB2 auf #FFFCF1 1,14:1 Nicht bestanden

Calm Sunset

Calm Sunset

CSS-Variablen

Über diese Palette

Farben im Detail

Kontrast & Barrierefreiheit

Ähnliche Paletten

Schriftarten

Icons & SVG

Farben

Bilder

CSS-Tools

Entwicklung

Dokumentation

Unternehmen