Nice Rabbit

Palette mit 8 Farben · Kühl · Gemischt · Harmonie: Komplementär

Zurück zur Bibliothek

Nice Rabbit

Palette mit 8 Farben · Temperatur: Kühl · Ton: Gemischt · Harmonie: Komplementär

Bearbeiten

Erdig 8 Farben Kühl Gemischt Komplementär 8colors palette bunny

Likes 25

Farben 8

CSS-Variablen

:root {
  --c-earthy-1: #5B976F;
  --c-earthy-2: #FFA41A;
  --c-earthy-3: #B32A32;
  --c-earthy-4: #FFF9FC;
  --c-earthy-5: #7E95BB;
  --c-earthy-6: #292453;
  --c-earthy-7: #1F1B32;
  --c-earthy-8: #100A21;
}

Über diese Palette

Diese erdige Palette mit 8 Farben reicht vom hellsten Ton Snowman (#FFF9FC) bis zum dunkelsten Ton Tristesse (#100A21). Sie vereint Endless, Phoenix Flames, Unmatched Beauty, Snowman, Soothsayer, Pāua, Black Howl und Tristesse in einem Set, das du direkt in deine Benutzeroberfläche übernehmen kannst. Farbpaare in der Palette: 28. Davon erreichen 12 die WCAG-AA-Kontrastschwelle (4,5:1) für Fließtext – am stärksten ist #FFF9FC auf #100A21 mit 18,58: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

Endless #5B976F

RGB: rgb(91, 151, 111)
HSL: hsl(140, 25%, 47%)
Luminanz: 0,255

Phoenix Flames #FFA41A

RGB: rgb(255, 164, 26)
HSL: hsl(36, 100%, 55%)
Luminanz: 0,479

Unmatched Beauty #B32A32

RGB: rgb(179, 42, 50)
HSL: hsl(356, 62%, 43%)
Luminanz: 0,115

Snowman #FFF9FC

RGB: rgb(255, 249, 252)
HSL: hsl(330, 100%, 99%)
Luminanz: 0,960

Soothsayer #7E95BB

RGB: rgb(126, 149, 187)
HSL: hsl(217, 31%, 61%)
Luminanz: 0,295

Pāua #292453

RGB: rgb(41, 36, 83)
HSL: hsl(246, 39%, 23%)
Luminanz: 0,024

Black Howl #1F1B32

RGB: rgb(31, 27, 50)
HSL: hsl(250, 30%, 15%)
Luminanz: 0,013

Tristesse #100A21

RGB: rgb(16, 10, 33)
HSL: hsl(256, 53%, 8%)
Luminanz: 0,004

Kontrast & Barrierefreiheit

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

Aa #FFF9FC auf #100A21 18,58:1 AAA

Aa #FFF9FC auf #1F1B32 16,02:1 AAA

Aa #FFF9FC auf #292453 13,73:1 AAA

Aa #FFA41A auf #100A21 9,73:1 AAA

Aa #FFA41A auf #1F1B32 8,39:1 AAA

Aa #FFA41A auf #292453 7,19:1 AAA

Aa #7E95BB auf #100A21 6,35:1 AA

Aa #B32A32 auf #FFF9FC 6,13:1 AA

Aa #5B976F auf #100A21 5,61:1 AA

Aa #7E95BB auf #1F1B32 5,47:1 AA

Aa #5B976F auf #1F1B32 4,84:1 AA

Aa #7E95BB auf #292453 4,69:1 AA

Aa #5B976F auf #292453 4,15:1 AA (großer Text)

Aa #5B976F auf #FFF9FC 3,31:1 AA (großer Text)

Aa #FFA41A auf #B32A32 3,21:1 AA (großer Text)

Aa #B32A32 auf #100A21 3,03:1 AA (großer Text)

Aa #FFF9FC auf #7E95BB 2,93:1 Nicht bestanden

Aa #B32A32 auf #1F1B32 2,61:1 Nicht bestanden

Aa #B32A32 auf #292453 2,24:1 Nicht bestanden

Aa #B32A32 auf #7E95BB 2,10:1 Nicht bestanden

Aa #FFA41A auf #FFF9FC 1,91:1 Nicht bestanden

Aa #5B976F auf #B32A32 1,85:1 Nicht bestanden

Aa #5B976F auf #FFA41A 1,73:1 Nicht bestanden

Aa #FFA41A auf #7E95BB 1,53:1 Nicht bestanden

Aa #292453 auf #100A21 1,35:1 Nicht bestanden

Aa #292453 auf #1F1B32 1,17:1 Nicht bestanden

Aa #1F1B32 auf #100A21 1,16:1 Nicht bestanden

Aa #5B976F auf #7E95BB 1,13:1 Nicht bestanden

Nice Rabbit

Nice Rabbit

CSS-Variablen

Über diese Palette

Farben im Detail

Kontrast & Barrierefreiheit

Ähnliche Paletten

Schriftarten

Icons & SVG

Farben

Bilder

CSS-Tools

Entwicklung

Dokumentation

Unternehmen