Nopri Nopri

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

Zurück zur Bibliothek

Nopri Nopri

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

Bearbeiten

Erdig 12 Farben Neutral Gemischt Komplementär polyphrog jungle aahhhh

Likes 20

Farben 12

CSS-Variablen

:root {
  --c-earthy-1: #000000;
  --c-earthy-2: #69392A;
  --c-earthy-3: #9B6426;
  --c-earthy-4: #BBD250;
  --c-earthy-5: #689133;
  --c-earthy-6: #205F51;
  --c-earthy-7: #2F8F8A;
  --c-earthy-8: #6ECFA7;
  --c-earthy-9: #F8F6F3;
  --c-earthy-10: #FF8EB4;
  --c-earthy-11: #B54193;
  --c-earthy-12: #504266;
}

Über diese Palette

Diese erdige Palette mit 12 Farben reicht vom hellsten Ton Venerable White (#F8F6F3) bis zum dunkelsten Ton Black (#000000). Sie vereint Black, In Caffeine We Trust, Olivia, Solid Gold, Olive Thrill, Teal Drama, Taos Turquoise, Minted Elegance, Venerable White, Schauss Pink, Boat Orchid und Evening Lavender in einem Set, das du direkt in deine Benutzeroberfläche übernehmen kannst. Farbpaare in der Palette: 66. Davon erreichen 15 die WCAG-AA-Kontrastschwelle (4,5:1) für Fließtext – am stärksten ist #000000 auf #F8F6F3 mit 19,47: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

In Caffeine We Trust #69392A

RGB: rgb(105, 57, 42)
HSL: hsl(14, 43%, 29%)
Luminanz: 0,061

Olivia #9B6426

RGB: rgb(155, 100, 38)
HSL: hsl(32, 61%, 38%)
Luminanz: 0,162

Solid Gold #BBD250

RGB: rgb(187, 210, 80)
HSL: hsl(71, 59%, 57%)
Luminanz: 0,572

Olive Thrill #689133

RGB: rgb(104, 145, 51)
HSL: hsl(86, 48%, 38%)
Luminanz: 0,234

Teal Drama #205F51

RGB: rgb(32, 95, 81)
HSL: hsl(167, 50%, 25%)
Luminanz: 0,091

Taos Turquoise #2F8F8A

RGB: rgb(47, 143, 138)
HSL: hsl(177, 51%, 37%)
Luminanz: 0,221

Minted Elegance #6ECFA7

RGB: rgb(110, 207, 167)
HSL: hsl(155, 50%, 62%)
Luminanz: 0,507

Venerable White #F8F6F3

RGB: rgb(248, 246, 243)
HSL: hsl(36, 26%, 96%)
Luminanz: 0,923

Schauss Pink #FF8EB4

RGB: rgb(255, 142, 180)
HSL: hsl(340, 100%, 78%)
Luminanz: 0,439

Boat Orchid #B54193

RGB: rgb(181, 65, 147)
HSL: hsl(318, 47%, 48%)
Luminanz: 0,157

Evening Lavender #504266

RGB: rgb(80, 66, 102)
HSL: hsl(263, 21%, 33%)
Luminanz: 0,066

Kontrast & Barrierefreiheit

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

Aa #000000 auf #F8F6F3 19,47:1 AAA

Aa #000000 auf #BBD250 12,45:1 AAA

Aa #000000 auf #6ECFA7 11,15:1 AAA

Aa #000000 auf #FF8EB4 9,78:1 AAA

Aa #69392A auf #F8F6F3 8,77:1 AAA

Aa #F8F6F3 auf #504266 8,42:1 AAA

Aa #205F51 auf #F8F6F3 6,91:1 AA

Aa #000000 auf #689133 5,69:1 AA

Aa #69392A auf #BBD250 5,61:1 AA

Aa #000000 auf #2F8F8A 5,42:1 AA

Aa #BBD250 auf #504266 5,38:1 AA

Aa #69392A auf #6ECFA7 5,02:1 AA

Aa #6ECFA7 auf #504266 4,82:1 AA

Aa #F8F6F3 auf #B54193 4,70:1 AA

Aa #9B6426 auf #F8F6F3 4,59:1 AA

Aa #BBD250 auf #205F51 4,42:1 AA (großer Text)

Aa #69392A auf #FF8EB4 4,41:1 AA (großer Text)

Aa #000000 auf #9B6426 4,24:1 AA (großer Text)

Aa #FF8EB4 auf #504266 4,23:1 AA (großer Text)

Aa #000000 auf #B54193 4,14:1 AA (großer Text)

Aa #205F51 auf #6ECFA7 3,96:1 AA (großer Text)

Aa #2F8F8A auf #F8F6F3 3,59:1 AA (großer Text)

Aa #205F51 auf #FF8EB4 3,47:1 AA (großer Text)

Aa #689133 auf #F8F6F3 3,42:1 AA (großer Text)

Aa #BBD250 auf #B54193 3,01:1 AA (großer Text)

Aa #9B6426 auf #BBD250 2,93:1 Nicht bestanden

Aa #000000 auf #205F51 2,82:1 Nicht bestanden

Aa #6ECFA7 auf #B54193 2,69:1 Nicht bestanden

Aa #9B6426 auf #6ECFA7 2,63:1 Nicht bestanden

Aa #69392A auf #689133 2,56:1 Nicht bestanden

Aa #689133 auf #504266 2,46:1 Nicht bestanden

Aa #69392A auf #2F8F8A 2,44:1 Nicht bestanden

Aa #FF8EB4 auf #B54193 2,36:1 Nicht bestanden

Aa #2F8F8A auf #504266 2,34:1 Nicht bestanden

Aa #000000 auf #504266 2,31:1 Nicht bestanden

Aa #9B6426 auf #FF8EB4 2,30:1 Nicht bestanden

Aa #BBD250 auf #2F8F8A 2,30:1 Nicht bestanden

Aa #000000 auf #69392A 2,22:1 Nicht bestanden

Aa #BBD250 auf #689133 2,19:1 Nicht bestanden

Aa #2F8F8A auf #6ECFA7 2,06:1 Nicht bestanden

Aa #689133 auf #205F51 2,02:1 Nicht bestanden

Aa #F8F6F3 auf #FF8EB4 1,99:1 Nicht bestanden

Aa #689133 auf #6ECFA7 1,96:1 Nicht bestanden

Aa #205F51 auf #2F8F8A 1,92:1 Nicht bestanden

Aa #69392A auf #9B6426 1,91:1 Nicht bestanden

Aa #69392A auf #B54193 1,87:1 Nicht bestanden

Aa #9B6426 auf #504266 1,84:1 Nicht bestanden

Aa #2F8F8A auf #FF8EB4 1,81:1 Nicht bestanden

Aa #B54193 auf #504266 1,79:1 Nicht bestanden

Aa #6ECFA7 auf #F8F6F3 1,75:1 Nicht bestanden

Aa #689133 auf #FF8EB4 1,72:1 Nicht bestanden

Aa #BBD250 auf #F8F6F3 1,56:1 Nicht bestanden

Aa #9B6426 auf #205F51 1,51:1 Nicht bestanden

Aa #205F51 auf #B54193 1,47:1 Nicht bestanden

Aa #689133 auf #B54193 1,37:1 Nicht bestanden

Aa #9B6426 auf #689133 1,34:1 Nicht bestanden

Aa #2F8F8A auf #B54193 1,31:1 Nicht bestanden

Aa #9B6426 auf #2F8F8A 1,28:1 Nicht bestanden

Aa #69392A auf #205F51 1,27:1 Nicht bestanden

Aa #BBD250 auf #FF8EB4 1,27:1 Nicht bestanden

Aa #205F51 auf #504266 1,22:1 Nicht bestanden

Aa #6ECFA7 auf #FF8EB4 1,14:1 Nicht bestanden

Aa #BBD250 auf #6ECFA7 1,12:1 Nicht bestanden

Aa #689133 auf #2F8F8A 1,05:1 Nicht bestanden

Aa #69392A auf #504266 1,04:1 Nicht bestanden

Aa #9B6426 auf #B54193 1,02:1 Nicht bestanden

Nopri Nopri

Nopri Nopri

CSS-Variablen

Über diese Palette

Farben im Detail

Kontrast & Barrierefreiheit

Ähnliche Paletten

Schriftarten

Icons & SVG

Farben

Bilder

CSS-Tools

Entwicklung

Dokumentation

Unternehmen