Grenade 8

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

Zurück zur Bibliothek

Grenade 8

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

Bearbeiten

Gedeckt 8 Farben Warm Dunkel Triadisch green brown grenade dim

Likes 64

Farben 8

CSS-Variablen

:root {
  --c-muted-1: #0D0B08;
  --c-muted-2: #131A17;
  --c-muted-3: #1B2621;
  --c-muted-4: #263D32;
  --c-muted-5: #2B5744;
  --c-muted-6: #377A5D;
  --c-muted-7: #6BAD92;
  --c-muted-8: #95D9BC;
}

Über diese Palette

Diese gedeckte Palette mit 8 Farben reicht vom hellsten Ton Green Jewel (#95D9BC) bis zum dunkelsten Ton Stout (#0D0B08). Sie vereint Stout, Dark Moon, Shadow Warrior, English Holly, Fresh Mint, Liquid Green Stuff, Dublin Jack und Green Jewel in einem Set, das du direkt in deine Benutzeroberfläche übernehmen kannst. Farbpaare in der Palette: 28. Davon erreichen 8 die WCAG-AA-Kontrastschwelle (4,5:1) für Fließtext – am stärksten ist #0D0B08 auf #95D9BC mit 12,1:1.

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

Farben im Detail

Stout #0D0B08

RGB: rgb(13, 11, 8)
HSL: hsl(36, 24%, 4%)
Luminanz: 0,003

Dark Moon #131A17

RGB: rgb(19, 26, 23)
HSL: hsl(154, 16%, 9%)
Luminanz: 0,009

Shadow Warrior #1B2621

RGB: rgb(27, 38, 33)
HSL: hsl(153, 17%, 13%)
Luminanz: 0,017

English Holly #263D32

RGB: rgb(38, 61, 50)
HSL: hsl(151, 23%, 19%)
Luminanz: 0,040

Fresh Mint #2B5744

RGB: rgb(43, 87, 68)
HSL: hsl(154, 34%, 25%)
Luminanz: 0,078

Liquid Green Stuff #377A5D

RGB: rgb(55, 122, 93)
HSL: hsl(154, 38%, 35%)
Luminanz: 0,155

Dublin Jack #6BAD92

RGB: rgb(107, 173, 146)
HSL: hsl(155, 29%, 55%)
Luminanz: 0,351

Green Jewel #95D9BC

RGB: rgb(149, 217, 188)
HSL: hsl(154, 47%, 72%)
Luminanz: 0,597

Kontrast & Barrierefreiheit

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

Aa #0D0B08 auf #95D9BC 12,10:1 AAA

Aa #131A17 auf #95D9BC 10,88:1 AAA

Aa #1B2621 auf #95D9BC 9,61:1 AAA

Aa #0D0B08 auf #6BAD92 7,50:1 AAA

Aa #263D32 auf #95D9BC 7,20:1 AAA

Aa #131A17 auf #6BAD92 6,75:1 AA

Aa #1B2621 auf #6BAD92 5,96:1 AA

Aa #2B5744 auf #95D9BC 5,07:1 AA

Aa #263D32 auf #6BAD92 4,46:1 AA (großer Text)

Aa #0D0B08 auf #377A5D 3,84:1 AA (großer Text)

Aa #131A17 auf #377A5D 3,46:1 AA (großer Text)

Aa #377A5D auf #95D9BC 3,15:1 AA (großer Text)

Aa #2B5744 auf #6BAD92 3,14:1 AA (großer Text)

Aa #1B2621 auf #377A5D 3,05:1 AA (großer Text)

Aa #0D0B08 auf #2B5744 2,39:1 Nicht bestanden

Aa #263D32 auf #377A5D 2,29:1 Nicht bestanden

Aa #131A17 auf #2B5744 2,15:1 Nicht bestanden

Aa #377A5D auf #6BAD92 1,95:1 Nicht bestanden

Aa #1B2621 auf #2B5744 1,89:1 Nicht bestanden

Aa #0D0B08 auf #263D32 1,68:1 Nicht bestanden

Aa #2B5744 auf #377A5D 1,61:1 Nicht bestanden

Aa #6BAD92 auf #95D9BC 1,61:1 Nicht bestanden

Aa #131A17 auf #263D32 1,51:1 Nicht bestanden

Aa #263D32 auf #2B5744 1,42:1 Nicht bestanden

Aa #1B2621 auf #263D32 1,33:1 Nicht bestanden

Aa #0D0B08 auf #1B2621 1,26:1 Nicht bestanden

Aa #131A17 auf #1B2621 1,13:1 Nicht bestanden

Aa #0D0B08 auf #131A17 1,11:1 Nicht bestanden

Grenade 8

Grenade 8

CSS-Variablen

Über diese Palette

Farben im Detail

Kontrast & Barrierefreiheit

Ähnliche Paletten

Schriftarten

Icons & SVG

Farben

Bilder

CSS-Tools

Entwicklung

Dokumentation

Unternehmen