SAD!

Palette mit 7 Farben · Neutral · Gemischt · Harmonie: Komplementär

Zurück zur Bibliothek

SAD!

Palette mit 7 Farben · Temperatur: Neutral · Ton: Gemischt · Harmonie: Komplementär

Bearbeiten

Gedeckt 7 Farben Neutral Gemischt Komplementär desaturated sad lonely

Likes 48

Farben 7

CSS-Variablen

:root {
  --c-muted-1: #1A1618;
  --c-muted-2: #40342F;
  --c-muted-3: #5D4561;
  --c-muted-4: #73728F;
  --c-muted-5: #769EA6;
  --c-muted-6: #A3CCAB;
  --c-muted-7: #E6E6E6;
}

Über diese Palette

Diese gedeckte Palette mit 7 Farben reicht vom hellsten Ton Extraordinary Abundance of Tinge (#E6E6E6) bis zum dunkelsten Ton Cynical Black (#1A1618). Sie vereint Cynical Black, Blackest Brown, Brunneous, Stormy Mauve, Rusty Tap, Fescue und Extraordinary Abundance of Tinge in einem Set, das du direkt in deine Benutzeroberfläche übernehmen kannst. Farbpaare in der Palette: 21. Davon erreichen 7 die WCAG-AA-Kontrastschwelle (4,5:1) für Fließtext – am stärksten ist #1A1618 auf #E6E6E6 mit 14,36:1.

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

Farben im Detail

Cynical Black #1A1618

RGB: rgb(26, 22, 24)
HSL: hsl(330, 8%, 9%)
Luminanz: 0,009

Blackest Brown #40342F

RGB: rgb(64, 52, 47)
HSL: hsl(18, 15%, 22%)
Luminanz: 0,038

Brunneous #5D4561

RGB: rgb(93, 69, 97)
HSL: hsl(291, 17%, 33%)
Luminanz: 0,075

Stormy Mauve #73728F

RGB: rgb(115, 114, 143)
HSL: hsl(242, 11%, 50%)
Luminanz: 0,177

Rusty Tap #769EA6

RGB: rgb(118, 158, 166)
HSL: hsl(190, 21%, 56%)
Luminanz: 0,311

Fescue #A3CCAB

RGB: rgb(163, 204, 171)
HSL: hsl(132, 29%, 72%)
Luminanz: 0,539

Extraordinary Abundance of Tinge #E6E6E6

RGB: rgb(230, 230, 230)
HSL: hsl(0, 0%, 90%)
Luminanz: 0,791

Kontrast & Barrierefreiheit

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

Aa #1A1618 auf #E6E6E6 14,36:1 AAA

Aa #1A1618 auf #A3CCAB 10,05:1 AAA

Aa #40342F auf #E6E6E6 9,61:1 AAA

Aa #5D4561 auf #E6E6E6 6,76:1 AA

Aa #40342F auf #A3CCAB 6,73:1 AA

Aa #1A1618 auf #769EA6 6,15:1 AA

Aa #5D4561 auf #A3CCAB 4,73:1 AA

Aa #40342F auf #769EA6 4,12:1 AA (großer Text)

Aa #1A1618 auf #73728F 3,87:1 AA (großer Text)

Aa #73728F auf #E6E6E6 3,71:1 AA (großer Text)

Aa #5D4561 auf #769EA6 2,90:1 Nicht bestanden

Aa #73728F auf #A3CCAB 2,60:1 Nicht bestanden

Aa #40342F auf #73728F 2,59:1 Nicht bestanden

Aa #769EA6 auf #E6E6E6 2,33:1 Nicht bestanden

Aa #1A1618 auf #5D4561 2,12:1 Nicht bestanden

Aa #5D4561 auf #73728F 1,82:1 Nicht bestanden

Aa #769EA6 auf #A3CCAB 1,63:1 Nicht bestanden

Aa #73728F auf #769EA6 1,59:1 Nicht bestanden

Aa #1A1618 auf #40342F 1,49:1 Nicht bestanden

Aa #A3CCAB auf #E6E6E6 1,43:1 Nicht bestanden

Aa #40342F auf #5D4561 1,42:1 Nicht bestanden

SAD!

SAD!

CSS-Variablen

Über diese Palette

Farben im Detail

Kontrast & Barrierefreiheit

Ähnliche Paletten

Schriftarten

Icons & SVG

Farben

Bilder

CSS-Tools

Entwicklung

Dokumentation

Unternehmen