Fiery Dreams

Palette mit 9 Farben · Warm · Gemischt · Harmonie: Triadisch

Zurück zur Bibliothek

Fiery Dreams

Palette mit 9 Farben · Temperatur: Warm · Ton: Gemischt · Harmonie: Triadisch

Bearbeiten

Lebendig 9 Farben Warm Gemischt Triadisch artist monoramp red warm

Likes 147

Farben 9

CSS-Variablen

:root {
  --c-vibrant-1: #251534;
  --c-vibrant-2: #461753;
  --c-vibrant-3: #701355;
  --c-vibrant-4: #A41759;
  --c-vibrant-5: #CD2561;
  --c-vibrant-6: #DE5568;
  --c-vibrant-7: #F0A383;
  --c-vibrant-8: #FAE4B9;
  --c-vibrant-9: #FFFEF0;
}

Über diese Palette

Diese lebendige Palette mit 9 Farben reicht vom hellsten Ton Ivory (#FFFEF0) bis zum dunkelsten Ton Blacklist (#251534). Sie vereint Blacklist, Plunged Into Darkness, Pansy Purple, Plum Perfect, Sensitive Scorpion, Nectarous Nectarine, Creamy Peach, Soya und Ivory in einem Set, das du direkt in deine Benutzeroberfläche übernehmen kannst. Farbpaare in der Palette: 36. Davon erreichen 13 die WCAG-AA-Kontrastschwelle (4,5:1) für Fließtext – am stärksten ist #251534 auf #FFFEF0 mit 16,74:1.

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

Farben im Detail

Blacklist #251534

RGB: rgb(37, 21, 52)
HSL: hsl(271, 42%, 14%)
Luminanz: 0,012

Plunged Into Darkness #461753

RGB: rgb(70, 23, 83)
HSL: hsl(287, 57%, 21%)
Luminanz: 0,025

Pansy Purple #701355

RGB: rgb(112, 19, 85)
HSL: hsl(317, 71%, 26%)
Luminanz: 0,046

Plum Perfect #A41759

RGB: rgb(164, 23, 89)
HSL: hsl(332, 75%, 37%)
Luminanz: 0,092

Sensitive Scorpion #CD2561

RGB: rgb(205, 37, 97)
HSL: hsl(339, 69%, 47%)
Luminanz: 0,152

Nectarous Nectarine #DE5568

RGB: rgb(222, 85, 104)
HSL: hsl(352, 67%, 60%)
Luminanz: 0,230

Creamy Peach #F0A383

RGB: rgb(240, 163, 131)
HSL: hsl(18, 78%, 73%)
Luminanz: 0,464

Soya #FAE4B9

RGB: rgb(250, 228, 185)
HSL: hsl(40, 87%, 85%)
Luminanz: 0,793

Ivory #FFFEF0

RGB: rgb(255, 254, 240)
HSL: hsl(56, 100%, 97%)
Luminanz: 0,984

Kontrast & Barrierefreiheit

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

Aa #251534 auf #FFFEF0 16,74:1 AAA

Aa #461753 auf #FFFEF0 13,72:1 AAA

Aa #251534 auf #FAE4B9 13,65:1 AAA

Aa #461753 auf #FAE4B9 11,18:1 AAA

Aa #701355 auf #FFFEF0 10,81:1 AAA

Aa #701355 auf #FAE4B9 8,81:1 AAA

Aa #251534 auf #F0A383 8,31:1 AAA

Aa #A41759 auf #FFFEF0 7,27:1 AAA

Aa #461753 auf #F0A383 6,81:1 AA

Aa #A41759 auf #FAE4B9 5,93:1 AA

Aa #701355 auf #F0A383 5,37:1 AA

Aa #CD2561 auf #FFFEF0 5,13:1 AA

Aa #251534 auf #DE5568 4,54:1 AA

Aa #CD2561 auf #FAE4B9 4,18:1 AA (großer Text)

Aa #461753 auf #DE5568 3,72:1 AA (großer Text)

Aa #DE5568 auf #FFFEF0 3,69:1 AA (großer Text)

Aa #A41759 auf #F0A383 3,61:1 AA (großer Text)

Aa #251534 auf #CD2561 3,26:1 AA (großer Text)

Aa #DE5568 auf #FAE4B9 3,01:1 AA (großer Text)

Aa #701355 auf #DE5568 2,93:1 Nicht bestanden

Aa #461753 auf #CD2561 2,67:1 Nicht bestanden

Aa #CD2561 auf #F0A383 2,55:1 Nicht bestanden

Aa #251534 auf #A41759 2,30:1 Nicht bestanden

Aa #701355 auf #CD2561 2,11:1 Nicht bestanden

Aa #F0A383 auf #FFFEF0 2,01:1 Nicht bestanden

Aa #A41759 auf #DE5568 1,97:1 Nicht bestanden

Aa #461753 auf #A41759 1,89:1 Nicht bestanden

Aa #DE5568 auf #F0A383 1,83:1 Nicht bestanden

Aa #F0A383 auf #FAE4B9 1,64:1 Nicht bestanden

Aa #251534 auf #701355 1,55:1 Nicht bestanden

Aa #701355 auf #A41759 1,49:1 Nicht bestanden

Aa #A41759 auf #CD2561 1,42:1 Nicht bestanden

Aa #CD2561 auf #DE5568 1,39:1 Nicht bestanden

Aa #461753 auf #701355 1,27:1 Nicht bestanden

Aa #FAE4B9 auf #FFFEF0 1,23:1 Nicht bestanden

Aa #251534 auf #461753 1,22:1 Nicht bestanden

Fiery Dreams

Fiery Dreams

CSS-Variablen

Über diese Palette

Farben im Detail

Kontrast & Barrierefreiheit

Ähnliche Paletten

Schriftarten

Icons & SVG

Farben

Bilder

CSS-Tools

Entwicklung

Dokumentation

Unternehmen