CVD8

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

Zurück zur Bibliothek

CVD8

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

Bearbeiten

Erdig 8 Farben Neutral Gemischt Komplementär colorblind cvd safe friendly

Likes 16

Farben 8

CSS-Variablen

:root {
  --c-earthy-1: #000000;
  --c-earthy-2: #0C2D98;
  --c-earthy-3: #78411F;
  --c-earthy-4: #2B74E2;
  --c-earthy-5: #DF5F5B;
  --c-earthy-6: #3BCCF6;
  --c-earthy-7: #F4CF60;
  --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, Blue Torus, Walnut, Enchanting Sapphire, Fiery Coral, Shovel Knight, Ride off Into the Sunset und White in einem Set, das du direkt in deine Benutzeroberfläche übernehmen kannst. Farbpaare in der Palette: 28. Davon erreichen 10 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

Blue Torus #0C2D98

RGB: rgb(12, 45, 152)
HSL: hsl(226, 85%, 32%)
Luminanz: 0,042

Walnut #78411F

RGB: rgb(120, 65, 31)
HSL: hsl(23, 59%, 30%)
Luminanz: 0,079

Enchanting Sapphire #2B74E2

RGB: rgb(43, 116, 226)
HSL: hsl(216, 76%, 53%)
Luminanz: 0,185

Fiery Coral #DF5F5B

RGB: rgb(223, 95, 91)
HSL: hsl(2, 67%, 62%)
Luminanz: 0,246

Shovel Knight #3BCCF6

RGB: rgb(59, 204, 246)
HSL: hsl(193, 91%, 60%)
Luminanz: 0,508

Ride off Into the Sunset #F4CF60

RGB: rgb(244, 207, 96)
HSL: hsl(45, 87%, 67%)
Luminanz: 0,647

White #FFFFFF

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

Kontrast & Barrierefreiheit

10 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 #F4CF60 13,94:1 AAA

Aa #0C2D98 auf #FFFFFF 11,39:1 AAA

Aa #000000 auf #3BCCF6 11,15:1 AAA

Aa #78411F auf #FFFFFF 8,16:1 AAA

Aa #0C2D98 auf #F4CF60 7,56:1 AAA

Aa #0C2D98 auf #3BCCF6 6,05:1 AA

Aa #000000 auf #DF5F5B 5,93:1 AA

Aa #78411F auf #F4CF60 5,41:1 AA

Aa #000000 auf #2B74E2 4,70:1 AA

Aa #2B74E2 auf #FFFFFF 4,47:1 AA (großer Text)

Aa #78411F auf #3BCCF6 4,33:1 AA (großer Text)

Aa #DF5F5B auf #FFFFFF 3,54:1 AA (großer Text)

Aa #0C2D98 auf #DF5F5B 3,21:1 AA (großer Text)

Aa #2B74E2 auf #F4CF60 2,97:1 Nicht bestanden

Aa #000000 auf #78411F 2,57:1 Nicht bestanden

Aa #0C2D98 auf #2B74E2 2,55:1 Nicht bestanden

Aa #2B74E2 auf #3BCCF6 2,37:1 Nicht bestanden

Aa #DF5F5B auf #F4CF60 2,35:1 Nicht bestanden

Aa #78411F auf #DF5F5B 2,30:1 Nicht bestanden

Aa #DF5F5B auf #3BCCF6 1,88:1 Nicht bestanden

Aa #3BCCF6 auf #FFFFFF 1,88:1 Nicht bestanden

Aa #000000 auf #0C2D98 1,84:1 Nicht bestanden

Aa #78411F auf #2B74E2 1,83:1 Nicht bestanden

Aa #F4CF60 auf #FFFFFF 1,51:1 Nicht bestanden

Aa #0C2D98 auf #78411F 1,40:1 Nicht bestanden

Aa #2B74E2 auf #DF5F5B 1,26:1 Nicht bestanden

Aa #3BCCF6 auf #F4CF60 1,25:1 Nicht bestanden

CVD8

CVD8

CSS-Variablen

Über diese Palette

Farben im Detail

Kontrast & Barrierefreiheit

Ähnliche Paletten

Schriftarten

Icons & SVG

Farben

Bilder

CSS-Tools

Entwicklung

Dokumentation

Unternehmen