Flashy 9

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

Zurück zur Bibliothek

Flashy 9

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

Bearbeiten

Lebendig 9 Farben Warm Gemischt Komplementär

Likes 15

Farben 9

CSS-Variablen

:root {
  --c-vibrant-1: #0A030D;
  --c-vibrant-2: #FFFFF7;
  --c-vibrant-3: #2CE8F5;
  --c-vibrant-4: #FFCF00;
  --c-vibrant-5: #FF0059;
  --c-vibrant-6: #004D57;
  --c-vibrant-7: #230C45;
  --c-vibrant-8: #7D2160;
  --c-vibrant-9: #2AD726;
}

Über diese Palette

Diese lebendige Palette mit 9 Farben reicht vom hellsten Ton Milk (#FFFFF7) bis zum dunkelsten Ton Broken Tube (#0A030D). Sie vereint Broken Tube, Milk, Sparky Blue, Fluorescent Orange, New York Sunset, Deep Atlantic Blue, Shadow Planet, Smooch und First of the Month Green in einem Set, das du direkt in deine Benutzeroberfläche übernehmen kannst. Farbpaare in der Palette: 36. Davon erreichen 17 die WCAG-AA-Kontrastschwelle (4,5:1) für Fließtext – am stärksten ist #0A030D auf #FFFFF7 mit 20,26:1.

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

Farben im Detail

Broken Tube #0A030D

RGB: rgb(10, 3, 13)
HSL: hsl(282, 63%, 3%)
Luminanz: 0,002

Milk #FFFFF7

RGB: rgb(255, 255, 247)
HSL: hsl(60, 100%, 98%)
Luminanz: 0,995

Sparky Blue #2CE8F5

RGB: rgb(44, 232, 245)
HSL: hsl(184, 91%, 57%)
Luminanz: 0,648

Fluorescent Orange #FFCF00

RGB: rgb(255, 207, 0)
HSL: hsl(49, 100%, 50%)
Luminanz: 0,659

New York Sunset #FF0059

RGB: rgb(255, 0, 89)
HSL: hsl(339, 100%, 50%)
Luminanz: 0,220

Deep Atlantic Blue #004D57

RGB: rgb(0, 77, 87)
HSL: hsl(187, 100%, 17%)
Luminanz: 0,060

Shadow Planet #230C45

RGB: rgb(35, 12, 69)
HSL: hsl(264, 70%, 16%)
Luminanz: 0,011

Smooch #7D2160

RGB: rgb(125, 33, 96)
HSL: hsl(319, 58%, 31%)
Luminanz: 0,063

First of the Month Green #2AD726

RGB: rgb(42, 215, 38)
HSL: hsl(119, 70%, 50%)
Luminanz: 0,492

Kontrast & Barrierefreiheit

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

Aa #0A030D auf #FFFFF7 20,26:1 AAA

Aa #FFFFF7 auf #230C45 17,27:1 AAA

Aa #0A030D auf #FFCF00 13,74:1 AAA

Aa #0A030D auf #2CE8F5 13,54:1 AAA

Aa #FFCF00 auf #230C45 11,72:1 AAA

Aa #2CE8F5 auf #230C45 11,54:1 AAA

Aa #0A030D auf #2AD726 10,51:1 AAA

Aa #FFFFF7 auf #004D57 9,50:1 AAA

Aa #FFFFF7 auf #7D2160 9,25:1 AAA

Aa #230C45 auf #2AD726 8,96:1 AAA

Aa #FFCF00 auf #004D57 6,45:1 AA

Aa #2CE8F5 auf #004D57 6,35:1 AA

Aa #FFCF00 auf #7D2160 6,28:1 AA

Aa #2CE8F5 auf #7D2160 6,18:1 AA

Aa #0A030D auf #FF0059 5,23:1 AA

Aa #004D57 auf #2AD726 4,93:1 AA

Aa #7D2160 auf #2AD726 4,80:1 AA

Aa #FF0059 auf #230C45 4,46:1 AA (großer Text)

Aa #FFFFF7 auf #FF0059 3,87:1 AA (großer Text)

Aa #FFCF00 auf #FF0059 2,63:1 Nicht bestanden

Aa #2CE8F5 auf #FF0059 2,59:1 Nicht bestanden

Aa #FF0059 auf #004D57 2,45:1 Nicht bestanden

Aa #FF0059 auf #7D2160 2,39:1 Nicht bestanden

Aa #0A030D auf #7D2160 2,19:1 Nicht bestanden

Aa #0A030D auf #004D57 2,13:1 Nicht bestanden

Aa #FF0059 auf #2AD726 2,01:1 Nicht bestanden

Aa #FFFFF7 auf #2AD726 1,93:1 Nicht bestanden

Aa #230C45 auf #7D2160 1,87:1 Nicht bestanden

Aa #004D57 auf #230C45 1,82:1 Nicht bestanden

Aa #FFFFF7 auf #2CE8F5 1,50:1 Nicht bestanden

Aa #FFFFF7 auf #FFCF00 1,47:1 Nicht bestanden

Aa #FFCF00 auf #2AD726 1,31:1 Nicht bestanden

Aa #2CE8F5 auf #2AD726 1,29:1 Nicht bestanden

Aa #0A030D auf #230C45 1,17:1 Nicht bestanden

Aa #004D57 auf #7D2160 1,03:1 Nicht bestanden

Aa #2CE8F5 auf #FFCF00 1,01:1 Nicht bestanden

Flashy 9

Flashy 9

CSS-Variablen

Über diese Palette

Farben im Detail

Kontrast & Barrierefreiheit

Ähnliche Paletten

Schriftarten

Icons & SVG

Farben

Bilder

CSS-Tools

Entwicklung

Dokumentation

Unternehmen