Swamp

Palette mit 8 Farben · Warm · Dunkel · Harmonie: Monochrom

Zurück zur Bibliothek

Swamp

Palette mit 8 Farben · Temperatur: Warm · Ton: Dunkel · Harmonie: Monochrom

Bearbeiten

Gedeckt 8 Farben Warm Dunkel Monochrom green dark swamp muddy

Likes 59

Farben 8

CSS-Variablen

:root {
  --c-muted-1: #2C2916;
  --c-muted-2: #424131;
  --c-muted-3: #575642;
  --c-muted-4: #928E89;
  --c-muted-5: #4E4F4A;
  --c-muted-6: #3D3C39;
  --c-muted-7: #353231;
  --c-muted-8: #1D1D1D;
}

Über diese Palette

Diese gedeckte Palette mit 8 Farben reicht vom hellsten Ton Bygone (#928E89) bis zum dunkelsten Ton Dynamic Black (#1D1D1D). Sie vereint Kenpōzome Black, Garden Path, Second Nature, Bygone, Subterrain Kingdom, Iridium, Sinister Minister und Dynamic Black in einem Set, das du direkt in deine Benutzeroberfläche übernehmen kannst. Farbpaare in der Palette: 28. Davon erreicht 1 die WCAG-AA-Kontrastschwelle (4,5:1) für Fließtext – am stärksten ist #928E89 auf #1D1D1D mit 5,18:1.

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

Farben im Detail

Kenpōzome Black #2C2916

RGB: rgb(44, 41, 22)
HSL: hsl(52, 33%, 13%)
Luminanz: 0,022

Garden Path #424131

RGB: rgb(66, 65, 49)
HSL: hsl(56, 15%, 23%)
Luminanz: 0,052

Second Nature #575642

RGB: rgb(87, 86, 66)
HSL: hsl(57, 14%, 30%)
Luminanz: 0,091

Bygone #928E89

RGB: rgb(146, 142, 137)
HSL: hsl(33, 4%, 55%)
Luminanz: 0,273

Subterrain Kingdom #4E4F4A

RGB: rgb(78, 79, 74)
HSL: hsl(72, 3%, 30%)
Luminanz: 0,077

Iridium #3D3C39

RGB: rgb(61, 60, 57)
HSL: hsl(45, 3%, 23%)
Luminanz: 0,045

Sinister Minister #353231

RGB: rgb(53, 50, 49)
HSL: hsl(15, 4%, 20%)
Luminanz: 0,033

Dynamic Black #1D1D1D

RGB: rgb(29, 29, 29)
HSL: hsl(0, 0%, 11%)
Luminanz: 0,012

Kontrast & Barrierefreiheit

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

Aa #928E89 auf #1D1D1D 5,18:1 AA

Aa #2C2916 auf #928E89 4,49:1 AA (großer Text)

Aa #928E89 auf #353231 3,91:1 AA (großer Text)

Aa #928E89 auf #3D3C39 3,39:1 AA (großer Text)

Aa #424131 auf #928E89 3,18:1 AA (großer Text)

Aa #928E89 auf #4E4F4A 2,54:1 Nicht bestanden

Aa #575642 auf #928E89 2,29:1 Nicht bestanden

Aa #575642 auf #1D1D1D 2,26:1 Nicht bestanden

Aa #4E4F4A auf #1D1D1D 2,04:1 Nicht bestanden

Aa #2C2916 auf #575642 1,96:1 Nicht bestanden

Aa #2C2916 auf #4E4F4A 1,77:1 Nicht bestanden

Aa #575642 auf #353231 1,70:1 Nicht bestanden

Aa #424131 auf #1D1D1D 1,63:1 Nicht bestanden

Aa #4E4F4A auf #353231 1,54:1 Nicht bestanden

Aa #3D3C39 auf #1D1D1D 1,53:1 Nicht bestanden

Aa #575642 auf #3D3C39 1,48:1 Nicht bestanden

Aa #2C2916 auf #424131 1,42:1 Nicht bestanden

Aa #424131 auf #575642 1,39:1 Nicht bestanden

Aa #2C2916 auf #3D3C39 1,33:1 Nicht bestanden

Aa #4E4F4A auf #3D3C39 1,33:1 Nicht bestanden

Aa #353231 auf #1D1D1D 1,33:1 Nicht bestanden

Aa #424131 auf #4E4F4A 1,25:1 Nicht bestanden

Aa #424131 auf #353231 1,23:1 Nicht bestanden

Aa #2C2916 auf #353231 1,15:1 Nicht bestanden

Aa #2C2916 auf #1D1D1D 1,15:1 Nicht bestanden

Aa #3D3C39 auf #353231 1,15:1 Nicht bestanden

Aa #575642 auf #4E4F4A 1,11:1 Nicht bestanden

Aa #424131 auf #3D3C39 1,07:1 Nicht bestanden

Swamp

Swamp

CSS-Variablen

Über diese Palette

Farben im Detail

Kontrast & Barrierefreiheit

Ähnliche Paletten

Schriftarten

Icons & SVG

Farben

Bilder

CSS-Tools

Entwicklung

Dokumentation

Unternehmen