Num_02

Palette mit 12 Farben · Warm · Gemischt · Harmonie: Analog

Zurück zur Bibliothek

Num_02

Palette mit 12 Farben · Temperatur: Warm · Ton: Gemischt · Harmonie: Analog

Bearbeiten

Erdig 12 Farben Warm Gemischt Analog two 2 number num

Likes 68

Farben 12

CSS-Variablen

:root {
  --c-earthy-1: #000000;
  --c-earthy-2: #B1B1B1;
  --c-earthy-3: #575757;
  --c-earthy-4: #FFFFFF;
  --c-earthy-5: #666600;
  --c-earthy-6: #CACA00;
  --c-earthy-7: #99004C;
  --c-earthy-8: #FF6BB5;
  --c-earthy-9: #00753A;
  --c-earthy-10: #00E572;
  --c-earthy-11: #0000A5;
  --c-earthy-12: #8989FF;
}

Über diese Palette

Diese erdige Palette mit 12 Farben reicht vom hellsten Ton White (#FFFFFF) bis zum dunkelsten Ton Black (#000000). Sie vereint Black, Palladium, Shadow Mountain, White, Earthy Khaki Green, Golden Foil, Celestial Pink, Fěn Hóng Pink, Dartmouth Green, Benzol Green, Bohemian Blue und Lavender Blue Shadow in einem Set, das du direkt in deine Benutzeroberfläche übernehmen kannst. Farbpaare in der Palette: 66. Davon erreichen 18 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

Palladium #B1B1B1

RGB: rgb(177, 177, 177)
HSL: hsl(0, 0%, 69%)
Luminanz: 0,440

Shadow Mountain #575757

RGB: rgb(87, 87, 87)
HSL: hsl(0, 0%, 34%)
Luminanz: 0,095

White #FFFFFF

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

Earthy Khaki Green #666600

RGB: rgb(102, 102, 0)
HSL: hsl(60, 100%, 20%)
Luminanz: 0,123

Golden Foil #CACA00

RGB: rgb(202, 202, 0)
HSL: hsl(60, 100%, 40%)
Luminanz: 0,548

Celestial Pink #99004C

RGB: rgb(153, 0, 76)
HSL: hsl(330, 100%, 30%)
Luminanz: 0,073

Fěn Hóng Pink #FF6BB5

RGB: rgb(255, 107, 181)
HSL: hsl(330, 100%, 71%)
Luminanz: 0,351

Dartmouth Green #00753A

RGB: rgb(0, 117, 58)
HSL: hsl(150, 100%, 23%)
Luminanz: 0,130

Benzol Green #00E572

RGB: rgb(0, 229, 114)
HSL: hsl(150, 100%, 45%)
Luminanz: 0,573

Bohemian Blue #0000A5

RGB: rgb(0, 0, 165)
HSL: hsl(240, 100%, 32%)
Luminanz: 0,027

Lavender Blue Shadow #8989FF

RGB: rgb(137, 137, 255)
HSL: hsl(240, 100%, 77%)
Luminanz: 0,304

Kontrast & Barrierefreiheit

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

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

Aa #FFFFFF auf #0000A5 13,61:1 AAA

Aa #000000 auf #00E572 12,45:1 AAA

Aa #000000 auf #CACA00 11,96:1 AAA

Aa #000000 auf #B1B1B1 9,79:1 AAA

Aa #FFFFFF auf #99004C 8,54:1 AAA

Aa #00E572 auf #0000A5 8,07:1 AAA

Aa #000000 auf #FF6BB5 8,02:1 AAA

Aa #CACA00 auf #0000A5 7,75:1 AAA

Aa #575757 auf #FFFFFF 7,23:1 AAA

Aa #000000 auf #8989FF 7,09:1 AAA

Aa #B1B1B1 auf #0000A5 6,35:1 AA

Aa #FFFFFF auf #666600 6,06:1 AA

Aa #FFFFFF auf #00753A 5,82:1 AA

Aa #FF6BB5 auf #0000A5 5,20:1 AA

Aa #99004C auf #00E572 5,06:1 AA

Aa #CACA00 auf #99004C 4,86:1 AA

Aa #0000A5 auf #8989FF 4,59:1 AA

Aa #575757 auf #00E572 4,28:1 AA (großer Text)

Aa #575757 auf #CACA00 4,12:1 AA (großer Text)

Aa #B1B1B1 auf #99004C 3,98:1 AA (großer Text)

Aa #000000 auf #00753A 3,61:1 AA (großer Text)

Aa #666600 auf #00E572 3,59:1 AA (großer Text)

Aa #000000 auf #666600 3,47:1 AA (großer Text)

Aa #666600 auf #CACA00 3,45:1 AA (großer Text)

Aa #00753A auf #00E572 3,45:1 AA (großer Text)

Aa #B1B1B1 auf #575757 3,37:1 AA (großer Text)

Aa #CACA00 auf #00753A 3,32:1 AA (großer Text)

Aa #99004C auf #FF6BB5 3,26:1 AA (großer Text)

Aa #FFFFFF auf #8989FF 2,96:1 Nicht bestanden

Aa #000000 auf #575757 2,91:1 Nicht bestanden

Aa #99004C auf #8989FF 2,88:1 Nicht bestanden

Aa #B1B1B1 auf #666600 2,83:1 Nicht bestanden

Aa #575757 auf #FF6BB5 2,76:1 Nicht bestanden

Aa #B1B1B1 auf #00753A 2,72:1 Nicht bestanden

Aa #FFFFFF auf #FF6BB5 2,62:1 Nicht bestanden

Aa #000000 auf #99004C 2,46:1 Nicht bestanden

Aa #575757 auf #8989FF 2,44:1 Nicht bestanden

Aa #00753A auf #0000A5 2,34:1 Nicht bestanden

Aa #666600 auf #FF6BB5 2,31:1 Nicht bestanden

Aa #666600 auf #0000A5 2,25:1 Nicht bestanden

Aa #FF6BB5 auf #00753A 2,22:1 Nicht bestanden

Aa #B1B1B1 auf #FFFFFF 2,14:1 Nicht bestanden

Aa #666600 auf #8989FF 2,04:1 Nicht bestanden

Aa #00753A auf #8989FF 1,97:1 Nicht bestanden

Aa #575757 auf #0000A5 1,88:1 Nicht bestanden

Aa #FFFFFF auf #CACA00 1,76:1 Nicht bestanden

Aa #00E572 auf #8989FF 1,76:1 Nicht bestanden

Aa #FFFFFF auf #00E572 1,69:1 Nicht bestanden

Aa #CACA00 auf #8989FF 1,69:1 Nicht bestanden

Aa #99004C auf #0000A5 1,59:1 Nicht bestanden

Aa #FF6BB5 auf #00E572 1,55:1 Nicht bestanden

Aa #000000 auf #0000A5 1,54:1 Nicht bestanden

Aa #CACA00 auf #FF6BB5 1,49:1 Nicht bestanden

Aa #99004C auf #00753A 1,47:1 Nicht bestanden

Aa #666600 auf #99004C 1,41:1 Nicht bestanden

Aa #B1B1B1 auf #8989FF 1,38:1 Nicht bestanden

Aa #B1B1B1 auf #00E572 1,27:1 Nicht bestanden

Aa #575757 auf #00753A 1,24:1 Nicht bestanden

Aa #B1B1B1 auf #CACA00 1,22:1 Nicht bestanden

Aa #B1B1B1 auf #FF6BB5 1,22:1 Nicht bestanden

Aa #575757 auf #666600 1,19:1 Nicht bestanden

Aa #575757 auf #99004C 1,18:1 Nicht bestanden

Aa #FF6BB5 auf #8989FF 1,13:1 Nicht bestanden

Aa #666600 auf #00753A 1,04:1 Nicht bestanden

Aa #CACA00 auf #00E572 1,04:1 Nicht bestanden

Num_02

Num_02

CSS-Variablen

Über diese Palette

Farben im Detail

Kontrast & Barrierefreiheit

Ähnliche Paletten

Schriftarten

Icons & SVG

Farben

Bilder

CSS-Tools

Entwicklung

Dokumentation

Unternehmen