QUINN_COLORS

Palette mit 9 Farben · Warm · Dunkel · Harmonie: Komplementär

Zurück zur Bibliothek

QUINN_COLORS

Palette mit 9 Farben · Temperatur: Warm · Ton: Dunkel · Harmonie: Komplementär

Bearbeiten

Erdig 9 Farben Warm Dunkel Komplementär pastel

Likes 24

Farben 9

CSS-Variablen

:root {
  --c-earthy-1: #2A2533;
  --c-earthy-2: #323C54;
  --c-earthy-3: #3E5E73;
  --c-earthy-4: #51855D;
  --c-earthy-5: #9FAD74;
  --c-earthy-6: #856149;
  --c-earthy-7: #713E4B;
  --c-earthy-8: #553154;
  --c-earthy-9: #3A3045;
}

Über diese Palette

Diese erdige Palette mit 9 Farben reicht vom hellsten Ton Siamese Green (#9FAD74) bis zum dunkelsten Ton Cold Steel (#2A2533). Sie vereint Cold Steel, Biscay, Superior Blue, Spring Garden, Siamese Green, Rawhide, Blood Rose, Purple Prose und Chrysomela Goettingensis in einem Set, das du direkt in deine Benutzeroberfläche übernehmen kannst. Farbpaare in der Palette: 36. Davon erreichen 3 die WCAG-AA-Kontrastschwelle (4,5:1) für Fließtext – am stärksten ist #2A2533 auf #9FAD74 mit 6,17:1.

Bodenständige, natürliche Töne – passend für nachhaltige und Bio-Marken, Cafés, Outdoor-Ausrüstung und warme redaktionelle Typografie.

Farben im Detail

Cold Steel #2A2533

RGB: rgb(42, 37, 51)
HSL: hsl(261, 16%, 17%)
Luminanz: 0,021

Biscay #323C54

RGB: rgb(50, 60, 84)
HSL: hsl(222, 25%, 26%)
Luminanz: 0,046

Superior Blue #3E5E73

RGB: rgb(62, 94, 115)
HSL: hsl(204, 30%, 35%)
Luminanz: 0,103

Spring Garden #51855D

RGB: rgb(81, 133, 93)
HSL: hsl(134, 24%, 42%)
Luminanz: 0,193

Siamese Green #9FAD74

RGB: rgb(159, 173, 116)
HSL: hsl(75, 26%, 57%)
Luminanz: 0,385

Rawhide #856149

RGB: rgb(133, 97, 73)
HSL: hsl(24, 29%, 40%)
Luminanz: 0,140

Blood Rose #713E4B

RGB: rgb(113, 62, 75)
HSL: hsl(345, 29%, 34%)
Luminanz: 0,075

Purple Prose #553154

RGB: rgb(85, 49, 84)
HSL: hsl(302, 27%, 26%)
Luminanz: 0,048

Chrysomela Goettingensis #3A3045

RGB: rgb(58, 48, 69)
HSL: hsl(269, 18%, 23%)
Luminanz: 0,034

Kontrast & Barrierefreiheit

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

Aa #2A2533 auf #9FAD74 6,17:1 AA

Aa #9FAD74 auf #3A3045 5,15:1 AA

Aa #323C54 auf #9FAD74 4,56:1 AA

Aa #9FAD74 auf #553154 4,46:1 AA (großer Text)

Aa #9FAD74 auf #713E4B 3,49:1 AA (großer Text)

Aa #2A2533 auf #51855D 3,45:1 AA (großer Text)

Aa #51855D auf #3A3045 2,88:1 Nicht bestanden

Aa #3E5E73 auf #9FAD74 2,85:1 Nicht bestanden

Aa #2A2533 auf #856149 2,70:1 Nicht bestanden

Aa #323C54 auf #51855D 2,55:1 Nicht bestanden

Aa #51855D auf #553154 2,49:1 Nicht bestanden

Aa #9FAD74 auf #856149 2,29:1 Nicht bestanden

Aa #856149 auf #3A3045 2,25:1 Nicht bestanden

Aa #2A2533 auf #3E5E73 2,16:1 Nicht bestanden

Aa #323C54 auf #856149 1,99:1 Nicht bestanden

Aa #51855D auf #713E4B 1,95:1 Nicht bestanden

Aa #856149 auf #553154 1,95:1 Nicht bestanden

Aa #3E5E73 auf #3A3045 1,81:1 Nicht bestanden

Aa #51855D auf #9FAD74 1,79:1 Nicht bestanden

Aa #2A2533 auf #713E4B 1,77:1 Nicht bestanden

Aa #323C54 auf #3E5E73 1,60:1 Nicht bestanden

Aa #3E5E73 auf #51855D 1,59:1 Nicht bestanden

Aa #3E5E73 auf #553154 1,56:1 Nicht bestanden

Aa #856149 auf #713E4B 1,53:1 Nicht bestanden

Aa #713E4B auf #3A3045 1,48:1 Nicht bestanden

Aa #2A2533 auf #553154 1,38:1 Nicht bestanden

Aa #2A2533 auf #323C54 1,35:1 Nicht bestanden

Aa #323C54 auf #713E4B 1,31:1 Nicht bestanden

Aa #51855D auf #856149 1,28:1 Nicht bestanden

Aa #713E4B auf #553154 1,28:1 Nicht bestanden

Aa #3E5E73 auf #856149 1,25:1 Nicht bestanden

Aa #3E5E73 auf #713E4B 1,22:1 Nicht bestanden

Aa #2A2533 auf #3A3045 1,20:1 Nicht bestanden

Aa #553154 auf #3A3045 1,16:1 Nicht bestanden

Aa #323C54 auf #3A3045 1,13:1 Nicht bestanden

Aa #323C54 auf #553154 1,02:1 Nicht bestanden

QUINN_COLORS

QUINN_COLORS

CSS-Variablen

Über diese Palette

Farben im Detail

Kontrast & Barrierefreiheit

Ähnliche Paletten

Schriftarten

Icons & SVG

Farben

Bilder

CSS-Tools

Entwicklung

Dokumentation

Unternehmen