S Sunset7

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

Zurück zur Bibliothek

S Sunset7

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

Bearbeiten

Lebendig 7 Farben Warm Gemischt Komplementär 7 artist red warm

Likes 164

Farben 7

CSS-Variablen

:root {
  --c-vibrant-1: #07102E;
  --c-vibrant-2: #431480;
  --c-vibrant-3: #981FAB;
  --c-vibrant-4: #F04181;
  --c-vibrant-5: #F76C59;
  --c-vibrant-6: #FAAA5A;
  --c-vibrant-7: #F0FAC8;
}

Über diese Palette

Diese lebendige Palette mit 7 Farben reicht vom hellsten Ton Fresh Grown (#F0FAC8) bis zum dunkelsten Ton Squid’s Ink (#07102E). Sie vereint Squid’s Ink, Grim Purple, Minesweeper’s Purple, Majestic Magenta, Camellia, Rajah und Fresh Grown in einem Set, das du direkt in deine Benutzeroberfläche übernehmen kannst. Farbpaare in der Palette: 21. Davon erreichen 7 die WCAG-AA-Kontrastschwelle (4,5:1) für Fließtext – am stärksten ist #07102E auf #F0FAC8 mit 17,11:1.

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

Farben im Detail

Squid’s Ink #07102E

RGB: rgb(7, 16, 46)
HSL: hsl(226, 74%, 10%)
Luminanz: 0,006

Grim Purple #431480

RGB: rgb(67, 20, 128)
HSL: hsl(266, 73%, 29%)
Luminanz: 0,033

Minesweeper’s Purple #981FAB

RGB: rgb(152, 31, 171)
HSL: hsl(292, 69%, 40%)
Luminanz: 0,106

Majestic Magenta #F04181

RGB: rgb(240, 65, 129)
HSL: hsl(338, 85%, 60%)
Luminanz: 0,239

Camellia #F76C59

RGB: rgb(247, 108, 89)
HSL: hsl(7, 91%, 66%)
Luminanz: 0,312

Rajah #FAAA5A

RGB: rgb(250, 170, 90)
HSL: hsl(30, 94%, 67%)
Luminanz: 0,498

Fresh Grown #F0FAC8

RGB: rgb(240, 250, 200)
HSL: hsl(72, 83%, 88%)
Luminanz: 0,911

Kontrast & Barrierefreiheit

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

Aa #07102E auf #F0FAC8 17,11:1 AAA

Aa #431480 auf #F0FAC8 11,64:1 AAA

Aa #07102E auf #FAAA5A 9,77:1 AAA

Aa #431480 auf #FAAA5A 6,64:1 AA

Aa #07102E auf #F76C59 6,45:1 AA

Aa #981FAB auf #F0FAC8 6,16:1 AA

Aa #07102E auf #F04181 5,15:1 AA

Aa #431480 auf #F76C59 4,39:1 AA (großer Text)

Aa #981FAB auf #FAAA5A 3,51:1 AA (großer Text)

Aa #431480 auf #F04181 3,50:1 AA (großer Text)

Aa #F04181 auf #F0FAC8 3,33:1 AA (großer Text)

Aa #07102E auf #981FAB 2,78:1 Nicht bestanden

Aa #F76C59 auf #F0FAC8 2,65:1 Nicht bestanden

Aa #981FAB auf #F76C59 2,32:1 Nicht bestanden

Aa #F04181 auf #FAAA5A 1,90:1 Nicht bestanden

Aa #431480 auf #981FAB 1,89:1 Nicht bestanden

Aa #981FAB auf #F04181 1,85:1 Nicht bestanden

Aa #FAAA5A auf #F0FAC8 1,75:1 Nicht bestanden

Aa #F76C59 auf #FAAA5A 1,51:1 Nicht bestanden

Aa #07102E auf #431480 1,47:1 Nicht bestanden

Aa #F04181 auf #F76C59 1,25:1 Nicht bestanden

S Sunset7

S Sunset7

CSS-Variablen

Über diese Palette

Farben im Detail

Kontrast & Barrierefreiheit

Ähnliche Paletten

Schriftarten

Icons & SVG

Farben

Bilder

CSS-Tools

Entwicklung

Dokumentation

Unternehmen