Grape 7

Palette mit 7 Farben · Kühl · Gemischt · Harmonie: Analog

Zurück zur Bibliothek

Grape 7

Palette mit 7 Farben · Temperatur: Kühl · Ton: Gemischt · Harmonie: Analog

Bearbeiten

Gedeckt 7 Farben Kühl Gemischt Analog 7 night purple grape

Likes 62

Farben 7

CSS-Variablen

:root {
  --c-muted-1: #262536;
  --c-muted-2: #3A3E71;
  --c-muted-3: #5C5CC2;
  --c-muted-4: #8361FF;
  --c-muted-5: #B588FF;
  --c-muted-6: #E9C4FF;
  --c-muted-7: #FFFFFF;
}

Über diese Palette

Diese gedeckte Palette mit 7 Farben reicht vom hellsten Ton White (#FFFFFF) bis zum dunkelsten Ton Cold Steel (#262536). Sie vereint Cold Steel, Lviv Blue, Circumorbital Ring, Purple Anemone, Lilac Geode, Wisteria Powder und White 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 #262536 auf #FFFFFF mit 15:1.

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

Farben im Detail

Cold Steel #262536

RGB: rgb(38, 37, 54)
HSL: hsl(244, 19%, 18%)
Luminanz: 0,020

Lviv Blue #3A3E71

RGB: rgb(58, 62, 113)
HSL: hsl(236, 32%, 34%)
Luminanz: 0,055

Circumorbital Ring #5C5CC2

RGB: rgb(92, 92, 194)
HSL: hsl(240, 46%, 56%)
Luminanz: 0,138

Purple Anemone #8361FF

RGB: rgb(131, 97, 255)
HSL: hsl(253, 100%, 69%)
Luminanz: 0,206

Lilac Geode #B588FF

RGB: rgb(181, 136, 255)
HSL: hsl(263, 100%, 77%)
Luminanz: 0,347

Wisteria Powder #E9C4FF

RGB: rgb(233, 196, 255)
HSL: hsl(278, 100%, 88%)
Luminanz: 0,640

White #FFFFFF

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

Kontrast & Barrierefreiheit

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

Aa #262536 auf #FFFFFF 15,00:1 AAA

Aa #3A3E71 auf #FFFFFF 9,96:1 AAA

Aa #262536 auf #E9C4FF 9,86:1 AAA

Aa #3A3E71 auf #E9C4FF 6,55:1 AA

Aa #262536 auf #B588FF 5,66:1 AA

Aa #5C5CC2 auf #FFFFFF 5,58:1 AA

Aa #8361FF auf #FFFFFF 4,10:1 AA (großer Text)

Aa #3A3E71 auf #B588FF 3,76:1 AA (großer Text)

Aa #5C5CC2 auf #E9C4FF 3,67:1 AA (großer Text)

Aa #262536 auf #8361FF 3,66:1 AA (großer Text)

Aa #8361FF auf #E9C4FF 2,70:1 Nicht bestanden

Aa #262536 auf #5C5CC2 2,69:1 Nicht bestanden

Aa #B588FF auf #FFFFFF 2,65:1 Nicht bestanden

Aa #3A3E71 auf #8361FF 2,43:1 Nicht bestanden

Aa #5C5CC2 auf #B588FF 2,11:1 Nicht bestanden

Aa #3A3E71 auf #5C5CC2 1,79:1 Nicht bestanden

Aa #B588FF auf #E9C4FF 1,74:1 Nicht bestanden

Aa #8361FF auf #B588FF 1,55:1 Nicht bestanden

Aa #E9C4FF auf #FFFFFF 1,52:1 Nicht bestanden

Aa #262536 auf #3A3E71 1,50:1 Nicht bestanden

Aa #5C5CC2 auf #8361FF 1,36:1 Nicht bestanden

Grape 7

Grape 7

CSS-Variablen

Über diese Palette

Farben im Detail

Kontrast & Barrierefreiheit

Ähnliche Paletten

Schriftarten

Icons & SVG

Farben

Bilder

CSS-Tools

Entwicklung

Dokumentation

Unternehmen