Code: Melon

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

Zurück zur Bibliothek

Code: Melon

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

Bearbeiten

Lebendig 6 Farben Warm Gemischt Komplementär artist grafxkid

Likes 19

Farben 6

CSS-Variablen

:root {
  --c-vibrant-1: #B440A3;
  --c-vibrant-2: #FF91AB;
  --c-vibrant-3: #79C220;
  --c-vibrant-4: #F1E899;
  --c-vibrant-5: #2A1A54;
  --c-vibrant-6: #20798B;
}

Über diese Palette

Diese lebendige Palette mit 6 Farben reicht vom hellsten Ton First Day of Summer (#F1E899) bis zum dunkelsten Ton Silent Orbit (#2A1A54). Sie vereint Ultraviolet Nusp, Baker-Miller Pink, Kiwi Crush, First Day of Summer, Silent Orbit und Bermuda in einem Set, das du direkt in deine Benutzeroberfläche übernehmen kannst. Farbpaare in der Palette: 15. Davon erreichen 3 die WCAG-AA-Kontrastschwelle (4,5:1) für Fließtext – am stärksten ist #F1E899 auf #2A1A54 mit 12,18:1.

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

Farben im Detail

Ultraviolet Nusp #B440A3

RGB: rgb(180, 64, 163)
HSL: hsl(309, 48%, 48%)
Luminanz: 0,160

Baker-Miller Pink #FF91AB

RGB: rgb(255, 145, 171)
HSL: hsl(346, 100%, 78%)
Luminanz: 0,445

Kiwi Crush #79C220

RGB: rgb(121, 194, 32)
HSL: hsl(87, 72%, 44%)
Luminanz: 0,428

First Day of Summer #F1E899

RGB: rgb(241, 232, 153)
HSL: hsl(54, 76%, 77%)
Luminanz: 0,787

Silent Orbit #2A1A54

RGB: rgb(42, 26, 84)
HSL: hsl(257, 53%, 22%)
Luminanz: 0,019

Bermuda #20798B

RGB: rgb(32, 121, 139)
HSL: hsl(190, 63%, 34%)
Luminanz: 0,159

Kontrast & Barrierefreiheit

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

Aa #F1E899 auf #2A1A54 12,18:1 AAA

Aa #FF91AB auf #2A1A54 7,20:1 AAA

Aa #79C220 auf #2A1A54 6,95:1 AA

Aa #F1E899 auf #20798B 4,02:1 AA (großer Text)

Aa #B440A3 auf #F1E899 3,98:1 AA (großer Text)

Aa #B440A3 auf #2A1A54 3,06:1 AA (großer Text)

Aa #2A1A54 auf #20798B 3,03:1 AA (großer Text)

Aa #FF91AB auf #20798B 2,37:1 Nicht bestanden

Aa #B440A3 auf #FF91AB 2,35:1 Nicht bestanden

Aa #79C220 auf #20798B 2,29:1 Nicht bestanden

Aa #B440A3 auf #79C220 2,27:1 Nicht bestanden

Aa #79C220 auf #F1E899 1,75:1 Nicht bestanden

Aa #FF91AB auf #F1E899 1,69:1 Nicht bestanden

Aa #FF91AB auf #79C220 1,04:1 Nicht bestanden

Aa #B440A3 auf #20798B 1,01:1 Nicht bestanden

Code: Melon

Code: Melon

CSS-Variablen

Über diese Palette

Farben im Detail

Kontrast & Barrierefreiheit

Ähnliche Paletten

Schriftarten

Icons & SVG

Farben

Bilder

CSS-Tools

Entwicklung

Dokumentation

Unternehmen