Arcadian

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

Zurück zur Bibliothek

Arcadian

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

Bearbeiten

Lebendig 8 Farben Warm Gemischt Komplementär arcade nostalgia jamestdg

Likes 38

Farben 8

CSS-Variablen

:root {
  --c-vibrant-1: #00000D;
  --c-vibrant-2: #FFFAFA;
  --c-vibrant-3: #FDDA61;
  --c-vibrant-4: #0CB625;
  --c-vibrant-5: #3418D5;
  --c-vibrant-6: #6F3892;
  --c-vibrant-7: #E62B00;
  --c-vibrant-8: #FF2EC1;
}

Über diese Palette

Diese lebendige Palette mit 8 Farben reicht vom hellsten Ton Snow (#FFFAFA) bis zum dunkelsten Ton Benthic Black (#00000D). Sie vereint Benthic Black, Snow, Naples Yellow, Spring Forth, Interdimensional Blue, Perkin Mauve, Tomato Red und Razzle Dazzle Rose 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 #00000D auf #FFFAFA mit 20,19:1.

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

Farben im Detail

Benthic Black #00000D

RGB: rgb(0, 0, 13)
HSL: hsl(240, 100%, 3%)
Luminanz: 0,000

Snow #FFFAFA

RGB: rgb(255, 250, 250)
HSL: hsl(0, 100%, 99%)
Luminanz: 0,965

Naples Yellow #FDDA61

RGB: rgb(253, 218, 97)
HSL: hsl(47, 98%, 69%)
Luminanz: 0,719

Spring Forth #0CB625

RGB: rgb(12, 182, 37)
HSL: hsl(129, 88%, 38%)
Luminanz: 0,337

Interdimensional Blue #3418D5

RGB: rgb(52, 24, 213)
HSL: hsl(249, 80%, 46%)
Luminanz: 0,062

Perkin Mauve #6F3892

RGB: rgb(111, 56, 146)
HSL: hsl(277, 45%, 40%)
Luminanz: 0,083

Tomato Red #E62B00

RGB: rgb(230, 43, 0)
HSL: hsl(11, 100%, 45%)
Luminanz: 0,186

Razzle Dazzle Rose #FF2EC1

RGB: rgb(255, 46, 193)
HSL: hsl(318, 100%, 59%)
Luminanz: 0,271

Kontrast & Barrierefreiheit

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

Aa #00000D auf #FFFAFA 20,19:1 AAA

Aa #00000D auf #FDDA61 15,29:1 AAA

Aa #FFFAFA auf #3418D5 9,08:1 AAA

Aa #00000D auf #0CB625 7,69:1 AAA

Aa #FFFAFA auf #6F3892 7,64:1 AAA

Aa #FDDA61 auf #3418D5 6,87:1 AA

Aa #00000D auf #FF2EC1 6,38:1 AA

Aa #FDDA61 auf #6F3892 5,79:1 AA

Aa #00000D auf #E62B00 4,68:1 AA

Aa #FFFAFA auf #E62B00 4,31:1 AA (großer Text)

Aa #0CB625 auf #3418D5 3,46:1 AA (großer Text)

Aa #FDDA61 auf #E62B00 3,26:1 AA (großer Text)

Aa #FFFAFA auf #FF2EC1 3,17:1 AA (großer Text)

Aa #0CB625 auf #6F3892 2,91:1 Nicht bestanden

Aa #3418D5 auf #FF2EC1 2,87:1 Nicht bestanden

Aa #00000D auf #6F3892 2,64:1 Nicht bestanden

Aa #FFFAFA auf #0CB625 2,63:1 Nicht bestanden

Aa #6F3892 auf #FF2EC1 2,41:1 Nicht bestanden

Aa #FDDA61 auf #FF2EC1 2,40:1 Nicht bestanden

Aa #00000D auf #3418D5 2,22:1 Nicht bestanden

Aa #3418D5 auf #E62B00 2,11:1 Nicht bestanden

Aa #FDDA61 auf #0CB625 1,99:1 Nicht bestanden

Aa #6F3892 auf #E62B00 1,77:1 Nicht bestanden

Aa #0CB625 auf #E62B00 1,64:1 Nicht bestanden

Aa #E62B00 auf #FF2EC1 1,36:1 Nicht bestanden

Aa #FFFAFA auf #FDDA61 1,32:1 Nicht bestanden

Aa #0CB625 auf #FF2EC1 1,21:1 Nicht bestanden

Aa #3418D5 auf #6F3892 1,19:1 Nicht bestanden

Arcadian

Arcadian

CSS-Variablen

Über diese Palette

Farben im Detail

Kontrast & Barrierefreiheit

Ähnliche Paletten

Schriftarten

Icons & SVG

Farben

Bilder

CSS-Tools

Entwicklung

Dokumentation

Unternehmen