QUALM12

Palette mit 12 Farben · Neutral · Gemischt · Harmonie: Triadisch

Zurück zur Bibliothek

QUALM12

Palette mit 12 Farben · Temperatur: Neutral · Ton: Gemischt · Harmonie: Triadisch

Bearbeiten

Erdig 12 Farben Neutral Gemischt Triadisch artist muted grim rust

Likes 22

Farben 12

CSS-Variablen

:root {
  --c-earthy-1: #0E0917;
  --c-earthy-2: #1A1429;
  --c-earthy-3: #282440;
  --c-earthy-4: #42363F;
  --c-earthy-5: #5C473E;
  --c-earthy-6: #8A746A;
  --c-earthy-7: #B5A39C;
  --c-earthy-8: #FCF8FB;
  --c-earthy-9: #9FADB3;
  --c-earthy-10: #6B818A;
  --c-earthy-11: #3E535C;
  --c-earthy-12: #40454E;
}

Über diese Palette

Diese erdige Palette mit 12 Farben reicht vom hellsten Ton Snowman (#FCF8FB) bis zum dunkelsten Ton Midnight Oil (#0E0917). Sie vereint Midnight Oil, Sambucus, Midnight Velvet, Deep Space Frigate, Tannery Brown, Pine Bark, Chocolate Oatmeal, Snowman, Pelican Bay, Citadel, Slate Wall und Alpine Duck Grey in einem Set, das du direkt in deine Benutzeroberfläche übernehmen kannst. Farbpaare in der Palette: 66. Davon erreichen 16 die WCAG-AA-Kontrastschwelle (4,5:1) für Fließtext – am stärksten ist #0E0917 auf #FCF8FB mit 18,65: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

Midnight Oil #0E0917

RGB: rgb(14, 9, 23)
HSL: hsl(261, 44%, 6%)
Luminanz: 0,004

Sambucus #1A1429

RGB: rgb(26, 20, 41)
HSL: hsl(257, 34%, 12%)
Luminanz: 0,009

Midnight Velvet #282440

RGB: rgb(40, 36, 64)
HSL: hsl(249, 28%, 20%)
Luminanz: 0,021

Deep Space Frigate #42363F

RGB: rgb(66, 54, 63)
HSL: hsl(315, 10%, 24%)
Luminanz: 0,042

Tannery Brown #5C473E

RGB: rgb(92, 71, 62)
HSL: hsl(18, 19%, 30%)
Luminanz: 0,071

Pine Bark #8A746A

RGB: rgb(138, 116, 106)
HSL: hsl(19, 13%, 48%)
Luminanz: 0,189

Chocolate Oatmeal #B5A39C

RGB: rgb(181, 163, 156)
HSL: hsl(17, 14%, 66%)
Luminanz: 0,384

Snowman #FCF8FB

RGB: rgb(252, 248, 251)
HSL: hsl(315, 40%, 98%)
Luminanz: 0,948

Pelican Bay #9FADB3

RGB: rgb(159, 173, 179)
HSL: hsl(198, 12%, 66%)
Luminanz: 0,405

Citadel #6B818A

RGB: rgb(107, 129, 138)
HSL: hsl(197, 13%, 48%)
Luminanz: 0,207

Slate Wall #3E535C

RGB: rgb(62, 83, 92)
HSL: hsl(198, 19%, 30%)
Luminanz: 0,080

Alpine Duck Grey #40454E

RGB: rgb(64, 69, 78)
HSL: hsl(219, 10%, 28%)
Luminanz: 0,059

Kontrast & Barrierefreiheit

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

Aa #0E0917 auf #FCF8FB 18,65:1 AAA

Aa #1A1429 auf #FCF8FB 16,97:1 AAA

Aa #282440 auf #FCF8FB 14,09:1 AAA

Aa #42363F auf #FCF8FB 10,90:1 AAA

Aa #FCF8FB auf #40454E 9,16:1 AAA

Aa #0E0917 auf #9FADB3 8,51:1 AAA

Aa #5C473E auf #FCF8FB 8,23:1 AAA

Aa #0E0917 auf #B5A39C 8,11:1 AAA

Aa #1A1429 auf #9FADB3 7,74:1 AAA

Aa #FCF8FB auf #3E535C 7,69:1 AAA

Aa #1A1429 auf #B5A39C 7,38:1 AAA

Aa #282440 auf #9FADB3 6,43:1 AA

Aa #282440 auf #B5A39C 6,13:1 AA

Aa #42363F auf #9FADB3 4,97:1 AA

Aa #0E0917 auf #6B818A 4,80:1 AA

Aa #42363F auf #B5A39C 4,74:1 AA

Aa #0E0917 auf #8A746A 4,47:1 AA (großer Text)

Aa #1A1429 auf #6B818A 4,36:1 AA (großer Text)

Aa #9FADB3 auf #40454E 4,18:1 AA (großer Text)

Aa #8A746A auf #FCF8FB 4,17:1 AA (großer Text)

Aa #1A1429 auf #8A746A 4,07:1 AA (großer Text)

Aa #B5A39C auf #40454E 3,98:1 AA (großer Text)

Aa #FCF8FB auf #6B818A 3,89:1 AA (großer Text)

Aa #5C473E auf #9FADB3 3,75:1 AA (großer Text)

Aa #282440 auf #6B818A 3,62:1 AA (großer Text)

Aa #5C473E auf #B5A39C 3,58:1 AA (großer Text)

Aa #9FADB3 auf #3E535C 3,51:1 AA (großer Text)

Aa #282440 auf #8A746A 3,38:1 AA (großer Text)

Aa #B5A39C auf #3E535C 3,34:1 AA (großer Text)

Aa #42363F auf #6B818A 2,80:1 Nicht bestanden

Aa #42363F auf #8A746A 2,61:1 Nicht bestanden

Aa #0E0917 auf #3E535C 2,43:1 Nicht bestanden

Aa #6B818A auf #40454E 2,36:1 Nicht bestanden

Aa #B5A39C auf #FCF8FB 2,30:1 Nicht bestanden

Aa #0E0917 auf #5C473E 2,27:1 Nicht bestanden

Aa #1A1429 auf #3E535C 2,21:1 Nicht bestanden

Aa #8A746A auf #40454E 2,20:1 Nicht bestanden

Aa #FCF8FB auf #9FADB3 2,19:1 Nicht bestanden

Aa #5C473E auf #6B818A 2,12:1 Nicht bestanden

Aa #1A1429 auf #5C473E 2,06:1 Nicht bestanden

Aa #0E0917 auf #40454E 2,04:1 Nicht bestanden

Aa #6B818A auf #3E535C 1,98:1 Nicht bestanden

Aa #5C473E auf #8A746A 1,97:1 Nicht bestanden

Aa #8A746A auf #9FADB3 1,90:1 Nicht bestanden

Aa #1A1429 auf #40454E 1,85:1 Nicht bestanden

Aa #8A746A auf #3E535C 1,84:1 Nicht bestanden

Aa #282440 auf #3E535C 1,83:1 Nicht bestanden

Aa #8A746A auf #B5A39C 1,81:1 Nicht bestanden

Aa #9FADB3 auf #6B818A 1,77:1 Nicht bestanden

Aa #0E0917 auf #42363F 1,71:1 Nicht bestanden

Aa #282440 auf #5C473E 1,71:1 Nicht bestanden

Aa #B5A39C auf #6B818A 1,69:1 Nicht bestanden

Aa #1A1429 auf #42363F 1,56:1 Nicht bestanden

Aa #282440 auf #40454E 1,54:1 Nicht bestanden

Aa #42363F auf #3E535C 1,42:1 Nicht bestanden

Aa #0E0917 auf #282440 1,32:1 Nicht bestanden

Aa #42363F auf #5C473E 1,32:1 Nicht bestanden

Aa #282440 auf #42363F 1,29:1 Nicht bestanden

Aa #1A1429 auf #282440 1,20:1 Nicht bestanden

Aa #42363F auf #40454E 1,19:1 Nicht bestanden

Aa #3E535C auf #40454E 1,19:1 Nicht bestanden

Aa #5C473E auf #40454E 1,11:1 Nicht bestanden

Aa #0E0917 auf #1A1429 1,10:1 Nicht bestanden

Aa #5C473E auf #3E535C 1,07:1 Nicht bestanden

Aa #8A746A auf #6B818A 1,07:1 Nicht bestanden

Aa #B5A39C auf #9FADB3 1,05:1 Nicht bestanden

QUALM12

QUALM12

CSS-Variablen

Über diese Palette

Farben im Detail

Kontrast & Barrierefreiheit

Ähnliche Paletten

Schriftarten

Icons & SVG

Farben

Bilder

CSS-Tools

Entwicklung

Dokumentation

Unternehmen