Borkfest

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

Zurück zur Bibliothek

Borkfest

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

Bearbeiten

Lebendig 8 Farben Warm Gemischt Analog skin food

Likes 852

Farben 8

CSS-Variablen

:root {
  --c-vibrant-1: #DFD785;
  --c-vibrant-2: #EBC275;
  --c-vibrant-3: #F39949;
  --c-vibrant-4: #FF7831;
  --c-vibrant-5: #CA5A2E;
  --c-vibrant-6: #963C3C;
  --c-vibrant-7: #3A2802;
  --c-vibrant-8: #202215;
}

Über diese Palette

Diese lebendige Palette mit 8 Farben reicht vom hellsten Ton Artichoke Heart (#DFD785) bis zum dunkelsten Ton Black Mesa (#202215). Sie vereint Artichoke Heart, Pasta Rasta, Question Mark Block, Temptatious Tangerine, Bronze Satin, New Sled, Secret Passage und Black Mesa in einem Set, das du direkt in deine Benutzeroberfläche übernehmen kannst. Farbpaare in der Palette: 28. Davon erreichen 9 die WCAG-AA-Kontrastschwelle (4,5:1) für Fließtext – am stärksten ist #DFD785 auf #202215 mit 10,91:1.

Eine vielseitige Palette für Marketingseiten, Hero-Blöcke von Produkten, Illustrationen und Akzentzustände in der UI.

Farben im Detail

Artichoke Heart #DFD785

RGB: rgb(223, 215, 133)
HSL: hsl(55, 58%, 70%)
Luminanz: 0,660

Pasta Rasta #EBC275

RGB: rgb(235, 194, 117)
HSL: hsl(39, 75%, 69%)
Luminanz: 0,575

Question Mark Block #F39949

RGB: rgb(243, 153, 73)
HSL: hsl(28, 88%, 62%)
Luminanz: 0,423

Temptatious Tangerine #FF7831

RGB: rgb(255, 120, 49)
HSL: hsl(21, 100%, 60%)
Luminanz: 0,349

Bronze Satin #CA5A2E

RGB: rgb(202, 90, 46)
HSL: hsl(17, 63%, 49%)
Luminanz: 0,201

New Sled #963C3C

RGB: rgb(150, 60, 60)
HSL: hsl(0, 43%, 41%)
Luminanz: 0,100

Secret Passage #3A2802

RGB: rgb(58, 40, 2)
HSL: hsl(41, 93%, 12%)
Luminanz: 0,024

Black Mesa #202215

RGB: rgb(32, 34, 21)
HSL: hsl(69, 24%, 11%)
Luminanz: 0,015

Kontrast & Barrierefreiheit

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

Aa #DFD785 auf #202215 10,91:1 AAA

Aa #EBC275 auf #202215 9,61:1 AAA

Aa #DFD785 auf #3A2802 9,56:1 AAA

Aa #EBC275 auf #3A2802 8,43:1 AAA

Aa #F39949 auf #202215 7,27:1 AAA

Aa #F39949 auf #3A2802 6,38:1 AA

Aa #FF7831 auf #202215 6,14:1 AA

Aa #FF7831 auf #3A2802 5,38:1 AA

Aa #DFD785 auf #963C3C 4,72:1 AA

Aa #EBC275 auf #963C3C 4,16:1 AA (großer Text)

Aa #CA5A2E auf #202215 3,85:1 AA (großer Text)

Aa #CA5A2E auf #3A2802 3,38:1 AA (großer Text)

Aa #F39949 auf #963C3C 3,15:1 AA (großer Text)

Aa #DFD785 auf #CA5A2E 2,83:1 Nicht bestanden

Aa #FF7831 auf #963C3C 2,65:1 Nicht bestanden

Aa #EBC275 auf #CA5A2E 2,49:1 Nicht bestanden

Aa #963C3C auf #202215 2,31:1 Nicht bestanden

Aa #963C3C auf #3A2802 2,03:1 Nicht bestanden

Aa #F39949 auf #CA5A2E 1,89:1 Nicht bestanden

Aa #DFD785 auf #FF7831 1,78:1 Nicht bestanden

Aa #CA5A2E auf #963C3C 1,67:1 Nicht bestanden

Aa #FF7831 auf #CA5A2E 1,59:1 Nicht bestanden

Aa #EBC275 auf #FF7831 1,57:1 Nicht bestanden

Aa #DFD785 auf #F39949 1,50:1 Nicht bestanden

Aa #EBC275 auf #F39949 1,32:1 Nicht bestanden

Aa #F39949 auf #FF7831 1,19:1 Nicht bestanden

Aa #DFD785 auf #EBC275 1,14:1 Nicht bestanden

Aa #3A2802 auf #202215 1,14:1 Nicht bestanden

Borkfest

Borkfest

CSS-Variablen

Über diese Palette

Farben im Detail

Kontrast & Barrierefreiheit

Ähnliche Paletten

Schriftarten

Icons & SVG

Farben

Bilder

CSS-Tools

Entwicklung

Dokumentation

Unternehmen