EqualRGB

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

Zurück zur Bibliothek

EqualRGB

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

Bearbeiten

Erdig 8 Farben Neutral Gemischt Komplementär calculated

Likes 14

Farben 8

CSS-Variablen

:root {
  --c-earthy-1: #000000;
  --c-earthy-2: #BB2222;
  --c-earthy-3: #009900;
  --c-earthy-4: #4444DD;
  --c-earthy-5: #44DDDD;
  --c-earthy-6: #FF66FF;
  --c-earthy-7: #BBBB22;
  --c-earthy-8: #FFFFFF;
}

Über diese Palette

Diese erdige Palette mit 8 Farben reicht vom hellsten Ton White (#FFFFFF) bis zum dunkelsten Ton Black (#000000). Sie vereint Black, Crisis Red, Islamic Green, Dark Soft Violet, Neon Nazar, Pink Flamingo, Spring Forward und White in einem Set, das du direkt in deine Benutzeroberfläche übernehmen kannst. Farbpaare in der Palette: 28. Davon erreichen 7 die WCAG-AA-Kontrastschwelle (4,5:1) für Fließtext – am stärksten ist #000000 auf #FFFFFF mit 21: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

Black #000000

RGB: rgb(0, 0, 0)
HSL: hsl(0, 0%, 0%)
Luminanz: 0,000

Crisis Red #BB2222

RGB: rgb(187, 34, 34)
HSL: hsl(0, 69%, 43%)
Luminanz: 0,118

Islamic Green #009900

RGB: rgb(0, 153, 0)
HSL: hsl(120, 100%, 30%)
Luminanz: 0,228

Dark Soft Violet #4444DD

RGB: rgb(68, 68, 221)
HSL: hsl(240, 69%, 57%)
Luminanz: 0,106

Neon Nazar #44DDDD

RGB: rgb(68, 221, 221)
HSL: hsl(180, 69%, 57%)
Luminanz: 0,582

Pink Flamingo #FF66FF

RGB: rgb(255, 102, 255)
HSL: hsl(300, 100%, 70%)
Luminanz: 0,380

Spring Forward #BBBB22

RGB: rgb(187, 187, 34)
HSL: hsl(60, 69%, 43%)
Luminanz: 0,462

White #FFFFFF

RGB: rgb(255, 255, 255)
HSL: hsl(0, 0%, 100%)
Luminanz: 1,000

Kontrast & Barrierefreiheit

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

Aa #000000 auf #FFFFFF 21,00:1 AAA

Aa #000000 auf #44DDDD 12,63:1 AAA

Aa #000000 auf #BBBB22 10,24:1 AAA

Aa #000000 auf #FF66FF 8,60:1 AAA

Aa #4444DD auf #FFFFFF 6,74:1 AA

Aa #BB2222 auf #FFFFFF 6,24:1 AA

Aa #000000 auf #009900 5,56:1 AA

Aa #4444DD auf #44DDDD 4,05:1 AA (großer Text)

Aa #009900 auf #FFFFFF 3,78:1 AA (großer Text)

Aa #BB2222 auf #44DDDD 3,75:1 AA (großer Text)

Aa #000000 auf #BB2222 3,36:1 AA (großer Text)

Aa #4444DD auf #BBBB22 3,29:1 AA (großer Text)

Aa #000000 auf #4444DD 3,12:1 AA (großer Text)

Aa #BB2222 auf #BBBB22 3,04:1 AA (großer Text)

Aa #4444DD auf #FF66FF 2,76:1 Nicht bestanden

Aa #BB2222 auf #FF66FF 2,55:1 Nicht bestanden

Aa #FF66FF auf #FFFFFF 2,44:1 Nicht bestanden

Aa #009900 auf #44DDDD 2,27:1 Nicht bestanden

Aa #BBBB22 auf #FFFFFF 2,05:1 Nicht bestanden

Aa #009900 auf #BBBB22 1,84:1 Nicht bestanden

Aa #009900 auf #4444DD 1,78:1 Nicht bestanden

Aa #44DDDD auf #FFFFFF 1,66:1 Nicht bestanden

Aa #BB2222 auf #009900 1,65:1 Nicht bestanden

Aa #009900 auf #FF66FF 1,55:1 Nicht bestanden

Aa #44DDDD auf #FF66FF 1,47:1 Nicht bestanden

Aa #44DDDD auf #BBBB22 1,23:1 Nicht bestanden

Aa #FF66FF auf #BBBB22 1,19:1 Nicht bestanden

Aa #BB2222 auf #4444DD 1,08:1 Nicht bestanden

EqualRGB

EqualRGB

CSS-Variablen

Über diese Palette

Farben im Detail

Kontrast & Barrierefreiheit

Ähnliche Paletten

Schriftarten

Icons & SVG

Farben

Bilder

CSS-Tools

Entwicklung

Dokumentation

Unternehmen