Shroom 8

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

Zurück zur Bibliothek

Shroom 8

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

Bearbeiten

Lebendig 8 Farben Warm Gemischt Komplementär bright marchmadnesspalettecontest mushrooms saturation

Likes 20

Farben 8

CSS-Variablen

:root {
  --c-vibrant-1: #01FF2C;
  --c-vibrant-2: #2CC8FF;
  --c-vibrant-3: #FF3399;
  --c-vibrant-4: #FF711A;
  --c-vibrant-5: #999900;
  --c-vibrant-6: #169D86;
  --c-vibrant-7: #7B1BBB;
  --c-vibrant-8: #6C1313;
}

Über diese Palette

Diese lebendige Palette mit 8 Farben reicht vom hellsten Ton Cyber Neon Green (#01FF2C) bis zum dunkelsten Ton Festive Bordeaux (#6C1313). Sie vereint Cyber Neon Green, Shovel Knight, Wild Strawberry, Shocking Orange, Pea Soup, Flamboyant Teal, Pheromone Purple und Festive Bordeaux in einem Set, das du direkt in deine Benutzeroberfläche übernehmen kannst. Farbpaare in der Palette: 28. Davon erreichen 3 die WCAG-AA-Kontrastschwelle (4,5:1) für Fließtext – am stärksten ist #01FF2C auf #6C1313 mit 8,82:1.

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

Farben im Detail

Cyber Neon Green #01FF2C

RGB: rgb(1, 255, 44)
HSL: hsl(130, 100%, 50%)
Luminanz: 0,717

Shovel Knight #2CC8FF

RGB: rgb(44, 200, 255)
HSL: hsl(196, 100%, 59%)
Luminanz: 0,491

Wild Strawberry #FF3399

RGB: rgb(255, 51, 153)
HSL: hsl(330, 100%, 60%)
Luminanz: 0,259

Shocking Orange #FF711A

RGB: rgb(255, 113, 26)
HSL: hsl(23, 100%, 55%)
Luminanz: 0,331

Pea Soup #999900

RGB: rgb(153, 153, 0)
HSL: hsl(60, 100%, 30%)
Luminanz: 0,296

Flamboyant Teal #169D86

RGB: rgb(22, 157, 134)
HSL: hsl(170, 75%, 35%)
Luminanz: 0,260

Pheromone Purple #7B1BBB

RGB: rgb(123, 27, 187)
HSL: hsl(276, 75%, 42%)
Luminanz: 0,086

Festive Bordeaux #6C1313

RGB: rgb(108, 19, 19)
HSL: hsl(0, 70%, 25%)
Luminanz: 0,037

Kontrast & Barrierefreiheit

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

Aa #01FF2C auf #6C1313 8,82:1 AAA

Aa #2CC8FF auf #6C1313 6,21:1 AA

Aa #01FF2C auf #7B1BBB 5,65:1 AA

Aa #FF711A auf #6C1313 4,38:1 AA (großer Text)

Aa #2CC8FF auf #7B1BBB 3,98:1 AA (großer Text)

Aa #999900 auf #6C1313 3,97:1 AA (großer Text)

Aa #169D86 auf #6C1313 3,56:1 AA (großer Text)

Aa #FF3399 auf #6C1313 3,55:1 AA (großer Text)

Aa #FF711A auf #7B1BBB 2,81:1 Nicht bestanden

Aa #999900 auf #7B1BBB 2,54:1 Nicht bestanden

Aa #01FF2C auf #FF3399 2,48:1 Nicht bestanden

Aa #01FF2C auf #169D86 2,47:1 Nicht bestanden

Aa #FF3399 auf #7B1BBB 2,28:1 Nicht bestanden

Aa #169D86 auf #7B1BBB 2,28:1 Nicht bestanden

Aa #01FF2C auf #999900 2,22:1 Nicht bestanden

Aa #01FF2C auf #FF711A 2,01:1 Nicht bestanden

Aa #2CC8FF auf #FF3399 1,75:1 Nicht bestanden

Aa #2CC8FF auf #169D86 1,74:1 Nicht bestanden

Aa #2CC8FF auf #999900 1,56:1 Nicht bestanden

Aa #7B1BBB auf #6C1313 1,56:1 Nicht bestanden

Aa #01FF2C auf #2CC8FF 1,42:1 Nicht bestanden

Aa #2CC8FF auf #FF711A 1,42:1 Nicht bestanden

Aa #FF3399 auf #FF711A 1,23:1 Nicht bestanden

Aa #FF711A auf #169D86 1,23:1 Nicht bestanden

Aa #FF3399 auf #999900 1,12:1 Nicht bestanden

Aa #999900 auf #169D86 1,11:1 Nicht bestanden

Aa #FF711A auf #999900 1,10:1 Nicht bestanden

Aa #FF3399 auf #169D86 1,00:1 Nicht bestanden

Shroom 8

Shroom 8

CSS-Variablen

Über diese Palette

Farben im Detail

Kontrast & Barrierefreiheit

Ähnliche Paletten

Schriftarten

Icons & SVG

Farben

Bilder

CSS-Tools

Entwicklung

Dokumentation

Unternehmen