Retro 8

Palette mit 8 Farben · Kühl · Dunkel · Harmonie: Triadisch

Zurück zur Bibliothek

Retro 8

Palette mit 8 Farben · Temperatur: Kühl · Ton: Dunkel · Harmonie: Triadisch

Bearbeiten

Lebendig 8 Farben Kühl Dunkel Triadisch colors space retro shading

Likes 107

Farben 8

CSS-Variablen

:root {
  --c-vibrant-1: #041026;
  --c-vibrant-2: #051A44;
  --c-vibrant-3: #1F0398;
  --c-vibrant-4: #5000C3;
  --c-vibrant-5: #7521EE;
  --c-vibrant-6: #0099C3;
  --c-vibrant-7: #00C38F;
  --c-vibrant-8: #3EE3B7;
}

Über diese Palette

Diese lebendige Palette mit 8 Farben reicht vom hellsten Ton Aphrodite Aqua (#3EE3B7) bis zum dunkelsten Ton Void (#041026). Sie vereint Void, Maastricht Blue, Blue Beetle, Elegant Midnight, Purple Blue, Atomic Blue, Blarney und Aphrodite Aqua in einem Set, das du direkt in deine Benutzeroberfläche übernehmen kannst. Farbpaare in der Palette: 28. Davon erreichen 9 die WCAG-AA-Kontrastschwelle (4,5:1) für Fließtext – am stärksten ist #041026 auf #3EE3B7 mit 11,63:1.

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

Farben im Detail

Void #041026

RGB: rgb(4, 16, 38)
HSL: hsl(219, 81%, 8%)
Luminanz: 0,005

Maastricht Blue #051A44

RGB: rgb(5, 26, 68)
HSL: hsl(220, 86%, 14%)
Luminanz: 0,012

Blue Beetle #1F0398

RGB: rgb(31, 3, 152)
HSL: hsl(251, 96%, 30%)
Luminanz: 0,026

Elegant Midnight #5000C3

RGB: rgb(80, 0, 195)
HSL: hsl(265, 100%, 38%)
Luminanz: 0,057

Purple Blue #7521EE

RGB: rgb(117, 33, 238)
HSL: hsl(265, 86%, 53%)
Luminanz: 0,110

Atomic Blue #0099C3

RGB: rgb(0, 153, 195)
HSL: hsl(193, 100%, 38%)
Luminanz: 0,267

Blarney #00C38F

RGB: rgb(0, 195, 143)
HSL: hsl(164, 100%, 38%)
Luminanz: 0,410

Aphrodite Aqua #3EE3B7

RGB: rgb(62, 227, 183)
HSL: hsl(164, 75%, 57%)
Luminanz: 0,594

Kontrast & Barrierefreiheit

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

Aa #041026 auf #3EE3B7 11,63:1 AAA

Aa #051A44 auf #3EE3B7 10,40:1 AAA

Aa #1F0398 auf #3EE3B7 8,45:1 AAA

Aa #041026 auf #00C38F 8,31:1 AAA

Aa #051A44 auf #00C38F 7,44:1 AAA

Aa #5000C3 auf #3EE3B7 6,05:1 AA

Aa #1F0398 auf #00C38F 6,04:1 AA

Aa #041026 auf #0099C3 5,73:1 AA

Aa #051A44 auf #0099C3 5,13:1 AA

Aa #5000C3 auf #00C38F 4,32:1 AA (großer Text)

Aa #1F0398 auf #0099C3 4,16:1 AA (großer Text)

Aa #7521EE auf #3EE3B7 4,01:1 AA (großer Text)

Aa #5000C3 auf #0099C3 2,98:1 Nicht bestanden

Aa #041026 auf #7521EE 2,90:1 Nicht bestanden

Aa #7521EE auf #00C38F 2,87:1 Nicht bestanden

Aa #051A44 auf #7521EE 2,59:1 Nicht bestanden

Aa #1F0398 auf #7521EE 2,10:1 Nicht bestanden

Aa #0099C3 auf #3EE3B7 2,03:1 Nicht bestanden

Aa #7521EE auf #0099C3 1,98:1 Nicht bestanden

Aa #041026 auf #5000C3 1,92:1 Nicht bestanden

Aa #051A44 auf #5000C3 1,72:1 Nicht bestanden

Aa #5000C3 auf #7521EE 1,51:1 Nicht bestanden

Aa #0099C3 auf #00C38F 1,45:1 Nicht bestanden

Aa #1F0398 auf #5000C3 1,40:1 Nicht bestanden

Aa #00C38F auf #3EE3B7 1,40:1 Nicht bestanden

Aa #041026 auf #1F0398 1,38:1 Nicht bestanden

Aa #051A44 auf #1F0398 1,23:1 Nicht bestanden

Aa #041026 auf #051A44 1,12:1 Nicht bestanden

Retro 8

Retro 8

CSS-Variablen

Über diese Palette

Farben im Detail

Kontrast & Barrierefreiheit

Ähnliche Paletten

Schriftarten

Icons & SVG

Farben

Bilder

CSS-Tools

Entwicklung

Dokumentation

Unternehmen