GG EyeStrain

Palette mit 8 Farben · Warm · Hell · Harmonie: Komplementär

Zurück zur Bibliothek

GG EyeStrain

Palette mit 8 Farben · Temperatur: Warm · Ton: Hell · Harmonie: Komplementär

Bearbeiten

Lebendig 8 Farben Warm Hell Komplementär 8 saturated bright small

Likes 27

Farben 8

CSS-Variablen

:root {
  --c-vibrant-1: #4F2D6F;
  --c-vibrant-2: #354DFF;
  --c-vibrant-3: #FF2D3F;
  --c-vibrant-4: #FFF34D;
  --c-vibrant-5: #76FF44;
  --c-vibrant-6: #FF3BFB;
  --c-vibrant-7: #AFFFF9;
  --c-vibrant-8: #FFF9FF;
}

Über diese Palette

Diese lebendige Palette mit 8 Farben reicht vom hellsten Ton Cold Snow (#FFF9FF) bis zum dunkelsten Ton Purple Seduction (#4F2D6F). Sie vereint Purple Seduction, Blueshift, Strawberry, Yellow Cattleya, Lush Greenery, Dried Magenta, Frostbite und Cold Snow in einem Set, das du direkt in deine Benutzeroberfläche übernehmen kannst. Farbpaare in der Palette: 28. Davon erreichen 7 die WCAG-AA-Kontrastschwelle (4,5:1) für Fließtext – am stärksten ist #4F2D6F auf #FFF9FF mit 10,45:1.

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

Farben im Detail

Purple Seduction #4F2D6F

RGB: rgb(79, 45, 111)
HSL: hsl(271, 42%, 31%)
Luminanz: 0,047

Blueshift #354DFF

RGB: rgb(53, 77, 255)
HSL: hsl(233, 100%, 60%)
Luminanz: 0,133

Strawberry #FF2D3F

RGB: rgb(255, 45, 63)
HSL: hsl(355, 100%, 59%)
Luminanz: 0,235

Yellow Cattleya #FFF34D

RGB: rgb(255, 243, 77)
HSL: hsl(56, 100%, 65%)
Luminanz: 0,859

Lush Greenery #76FF44

RGB: rgb(118, 255, 68)
HSL: hsl(104, 100%, 63%)
Luminanz: 0,758

Dried Magenta #FF3BFB

RGB: rgb(255, 59, 251)
HSL: hsl(301, 100%, 62%)
Luminanz: 0,314

Frostbite #AFFFF9

RGB: rgb(175, 255, 249)
HSL: hsl(176, 100%, 84%)
Luminanz: 0,875

Cold Snow #FFF9FF

RGB: rgb(255, 249, 255)
HSL: hsl(300, 100%, 99%)
Luminanz: 0,962

Kontrast & Barrierefreiheit

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

Aa #4F2D6F auf #FFF9FF 10,45:1 AAA

Aa #4F2D6F auf #AFFFF9 9,55:1 AAA

Aa #4F2D6F auf #FFF34D 9,38:1 AAA

Aa #4F2D6F auf #76FF44 8,34:1 AAA

Aa #354DFF auf #FFF9FF 5,54:1 AA

Aa #354DFF auf #AFFFF9 5,06:1 AA

Aa #354DFF auf #FFF34D 4,97:1 AA

Aa #354DFF auf #76FF44 4,42:1 AA (großer Text)

Aa #4F2D6F auf #FF3BFB 3,75:1 AA (großer Text)

Aa #FF2D3F auf #FFF9FF 3,55:1 AA (großer Text)

Aa #FF2D3F auf #AFFFF9 3,25:1 AA (großer Text)

Aa #FF2D3F auf #FFF34D 3,19:1 AA (großer Text)

Aa #4F2D6F auf #FF2D3F 2,94:1 Nicht bestanden

Aa #FF2D3F auf #76FF44 2,84:1 Nicht bestanden

Aa #FF3BFB auf #FFF9FF 2,78:1 Nicht bestanden

Aa #FF3BFB auf #AFFFF9 2,54:1 Nicht bestanden

Aa #FFF34D auf #FF3BFB 2,50:1 Nicht bestanden

Aa #76FF44 auf #FF3BFB 2,22:1 Nicht bestanden

Aa #354DFF auf #FF3BFB 1,99:1 Nicht bestanden

Aa #4F2D6F auf #354DFF 1,89:1 Nicht bestanden

Aa #354DFF auf #FF2D3F 1,56:1 Nicht bestanden

Aa #FF2D3F auf #FF3BFB 1,28:1 Nicht bestanden

Aa #76FF44 auf #FFF9FF 1,25:1 Nicht bestanden

Aa #76FF44 auf #AFFFF9 1,14:1 Nicht bestanden

Aa #FFF34D auf #76FF44 1,13:1 Nicht bestanden

Aa #FFF34D auf #FFF9FF 1,11:1 Nicht bestanden

Aa #AFFFF9 auf #FFF9FF 1,09:1 Nicht bestanden

Aa #FFF34D auf #AFFFF9 1,02:1 Nicht bestanden

GG EyeStrain

GG EyeStrain

CSS-Variablen

Über diese Palette

Farben im Detail

Kontrast & Barrierefreiheit

Ähnliche Paletten

Schriftarten

Icons & SVG

Farben

Bilder

CSS-Tools

Entwicklung

Dokumentation

Unternehmen