LOAM 8

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

Zurück zur Bibliothek

LOAM 8

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

Bearbeiten

Gedeckt 8 Farben Warm Gemischt Komplementär soft lowsaturation 8color lowcontrast

Likes 57

Farben 8

CSS-Variablen

:root {
  --c-muted-1: #33302C;
  --c-muted-2: #52322F;
  --c-muted-3: #765C42;
  --c-muted-4: #9B976A;
  --c-muted-5: #A8B698;
  --c-muted-6: #C0C1C3;
  --c-muted-7: #868BA7;
  --c-muted-8: #6C5A92;
}

Über diese Palette

Diese gedeckte Palette mit 8 Farben reicht vom hellsten Ton Magnesium (#C0C1C3) bis zum dunkelsten Ton Holy Crow (#33302C). Sie vereint Holy Crow, Indian Fig, Wooden Cabin, Hiking, Mow the Lawn, Magnesium, Violet Aura und Just a Fairytale in einem Set, das du direkt in deine Benutzeroberfläche übernehmen kannst. Farbpaare in der Palette: 28. Davon erreichen 4 die WCAG-AA-Kontrastschwelle (4,5:1) für Fließtext – am stärksten ist #33302C auf #C0C1C3 mit 7,29:1.

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

Farben im Detail

Holy Crow #33302C

RGB: rgb(51, 48, 44)
HSL: hsl(34, 7%, 19%)
Luminanz: 0,030

Indian Fig #52322F

RGB: rgb(82, 50, 47)
HSL: hsl(5, 27%, 25%)
Luminanz: 0,043

Wooden Cabin #765C42

RGB: rgb(118, 92, 66)
HSL: hsl(30, 28%, 36%)
Luminanz: 0,119

Hiking #9B976A

RGB: rgb(155, 151, 106)
HSL: hsl(55, 20%, 51%)
Luminanz: 0,301

Mow the Lawn #A8B698

RGB: rgb(168, 182, 152)
HSL: hsl(88, 17%, 65%)
Luminanz: 0,441

Magnesium #C0C1C3

RGB: rgb(192, 193, 195)
HSL: hsl(220, 2%, 76%)
Luminanz: 0,533

Violet Aura #868BA7

RGB: rgb(134, 139, 167)
HSL: hsl(231, 16%, 59%)
Luminanz: 0,263

Just a Fairytale #6C5A92

RGB: rgb(108, 90, 146)
HSL: hsl(259, 24%, 46%)
Luminanz: 0,126

Kontrast & Barrierefreiheit

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

Aa #33302C auf #C0C1C3 7,29:1 AAA

Aa #52322F auf #C0C1C3 6,28:1 AA

Aa #33302C auf #A8B698 6,13:1 AA

Aa #52322F auf #A8B698 5,29:1 AA

Aa #33302C auf #9B976A 4,39:1 AA (großer Text)

Aa #33302C auf #868BA7 3,92:1 AA (großer Text)

Aa #52322F auf #9B976A 3,79:1 AA (großer Text)

Aa #765C42 auf #C0C1C3 3,45:1 AA (großer Text)

Aa #52322F auf #868BA7 3,38:1 AA (großer Text)

Aa #C0C1C3 auf #6C5A92 3,32:1 AA (großer Text)

Aa #765C42 auf #A8B698 2,90:1 Nicht bestanden

Aa #A8B698 auf #6C5A92 2,79:1 Nicht bestanden

Aa #33302C auf #6C5A92 2,20:1 Nicht bestanden

Aa #33302C auf #765C42 2,11:1 Nicht bestanden

Aa #765C42 auf #9B976A 2,08:1 Nicht bestanden

Aa #9B976A auf #6C5A92 2,00:1 Nicht bestanden

Aa #52322F auf #6C5A92 1,89:1 Nicht bestanden

Aa #C0C1C3 auf #868BA7 1,86:1 Nicht bestanden

Aa #765C42 auf #868BA7 1,85:1 Nicht bestanden

Aa #52322F auf #765C42 1,82:1 Nicht bestanden

Aa #868BA7 auf #6C5A92 1,78:1 Nicht bestanden

Aa #9B976A auf #C0C1C3 1,66:1 Nicht bestanden

Aa #A8B698 auf #868BA7 1,57:1 Nicht bestanden

Aa #9B976A auf #A8B698 1,40:1 Nicht bestanden

Aa #A8B698 auf #C0C1C3 1,19:1 Nicht bestanden

Aa #33302C auf #52322F 1,16:1 Nicht bestanden

Aa #9B976A auf #868BA7 1,12:1 Nicht bestanden

Aa #765C42 auf #6C5A92 1,04:1 Nicht bestanden

LOAM 8

LOAM 8

CSS-Variablen

Über diese Palette

Farben im Detail

Kontrast & Barrierefreiheit

Ähnliche Paletten

Schriftarten

Icons & SVG

Farben

Bilder

CSS-Tools

Entwicklung

Dokumentation

Unternehmen