NostalgOS 12

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

Zurück zur Bibliothek

NostalgOS 12

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

Bearbeiten

Erdig 12 Farben Warm Gemischt Komplementär retro nostalgic rainbow faded

Likes 142

Farben 12

CSS-Variablen

:root {
  --c-earthy-1: #DC6250;
  --c-earthy-2: #DEADA5;
  --c-earthy-3: #DAD4C9;
  --c-earthy-4: #FFD183;
  --c-earthy-5: #EEB24A;
  --c-earthy-6: #55927F;
  --c-earthy-7: #21525A;
  --c-earthy-8: #272A32;
  --c-earthy-9: #2152A5;
  --c-earthy-10: #5A8BDE;
  --c-earthy-11: #B89CE9;
  --c-earthy-12: #844790;
}

Über diese Palette

Diese erdige Palette mit 12 Farben reicht vom hellsten Ton Bread and Butter (#FFD183) bis zum dunkelsten Ton Night Sky (#272A32). Sie vereint Daring, Pale Blush, Gilded Linen, Bread and Butter, Goldsmith, Puerto Princesa, Hidden Waters, Night Sky, Ruri Blue, Blue Jay, Dreamy Candy Forest und Voodoo Violet in einem Set, das du direkt in deine Benutzeroberfläche übernehmen kannst. Farbpaare in der Palette: 66. Davon erreichen 10 die WCAG-AA-Kontrastschwelle (4,5:1) für Fließtext – am stärksten ist #FFD183 auf #272A32 mit 10,04: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

Daring #DC6250

RGB: rgb(220, 98, 80)
HSL: hsl(8, 67%, 59%)
Luminanz: 0,245

Pale Blush #DEADA5

RGB: rgb(222, 173, 165)
HSL: hsl(8, 46%, 76%)
Luminanz: 0,481

Gilded Linen #DAD4C9

RGB: rgb(218, 212, 201)
HSL: hsl(39, 19%, 82%)
Luminanz: 0,662

Bread and Butter #FFD183

RGB: rgb(255, 209, 131)
HSL: hsl(38, 100%, 76%)
Luminanz: 0,685

Goldsmith #EEB24A

RGB: rgb(238, 178, 74)
HSL: hsl(38, 83%, 61%)
Luminanz: 0,505

Puerto Princesa #55927F

RGB: rgb(85, 146, 127)
HSL: hsl(161, 26%, 45%)
Luminanz: 0,240

Hidden Waters #21525A

RGB: rgb(33, 82, 90)
HSL: hsl(188, 46%, 24%)
Luminanz: 0,071

Night Sky #272A32

RGB: rgb(39, 42, 50)
HSL: hsl(224, 12%, 17%)
Luminanz: 0,023

Ruri Blue #2152A5

RGB: rgb(33, 82, 165)
HSL: hsl(218, 67%, 39%)
Luminanz: 0,091

Blue Jay #5A8BDE

RGB: rgb(90, 139, 222)
HSL: hsl(218, 67%, 61%)
Luminanz: 0,259

Dreamy Candy Forest #B89CE9

RGB: rgb(184, 156, 233)
HSL: hsl(262, 64%, 76%)
Luminanz: 0,399

Voodoo Violet #844790

RGB: rgb(132, 71, 144)
HSL: hsl(290, 34%, 42%)
Luminanz: 0,114

Kontrast & Barrierefreiheit

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

Aa #FFD183 auf #272A32 10,04:1 AAA

Aa #DAD4C9 auf #272A32 9,73:1 AAA

Aa #EEB24A auf #272A32 7,59:1 AAA

Aa #DEADA5 auf #272A32 7,26:1 AAA

Aa #272A32 auf #B89CE9 6,13:1 AA

Aa #FFD183 auf #21525A 6,08:1 AA

Aa #DAD4C9 auf #21525A 5,89:1 AA

Aa #FFD183 auf #2152A5 5,22:1 AA

Aa #DAD4C9 auf #2152A5 5,06:1 AA

Aa #EEB24A auf #21525A 4,59:1 AA

Aa #FFD183 auf #844790 4,47:1 AA (großer Text)

Aa #DEADA5 auf #21525A 4,39:1 AA (großer Text)

Aa #DAD4C9 auf #844790 4,34:1 AA (großer Text)

Aa #272A32 auf #5A8BDE 4,22:1 AA (großer Text)

Aa #DC6250 auf #272A32 4,04:1 AA (großer Text)

Aa #55927F auf #272A32 3,97:1 AA (großer Text)

Aa #EEB24A auf #2152A5 3,94:1 AA (großer Text)

Aa #DEADA5 auf #2152A5 3,78:1 AA (großer Text)

Aa #21525A auf #B89CE9 3,71:1 AA (großer Text)

Aa #EEB24A auf #844790 3,38:1 AA (großer Text)

Aa #DEADA5 auf #844790 3,23:1 AA (großer Text)

Aa #2152A5 auf #B89CE9 3,19:1 AA (großer Text)

Aa #B89CE9 auf #844790 2,73:1 Nicht bestanden

Aa #21525A auf #5A8BDE 2,56:1 Nicht bestanden

Aa #FFD183 auf #55927F 2,53:1 Nicht bestanden

Aa #DC6250 auf #FFD183 2,49:1 Nicht bestanden

Aa #DAD4C9 auf #55927F 2,45:1 Nicht bestanden

Aa #DC6250 auf #21525A 2,44:1 Nicht bestanden

Aa #DC6250 auf #DAD4C9 2,41:1 Nicht bestanden

Aa #55927F auf #21525A 2,40:1 Nicht bestanden

Aa #FFD183 auf #5A8BDE 2,38:1 Nicht bestanden

Aa #DAD4C9 auf #5A8BDE 2,30:1 Nicht bestanden

Aa #272A32 auf #844790 2,24:1 Nicht bestanden

Aa #2152A5 auf #5A8BDE 2,20:1 Nicht bestanden

Aa #DC6250 auf #2152A5 2,10:1 Nicht bestanden

Aa #55927F auf #2152A5 2,06:1 Nicht bestanden

Aa #272A32 auf #2152A5 1,92:1 Nicht bestanden

Aa #EEB24A auf #55927F 1,91:1 Nicht bestanden

Aa #DC6250 auf #EEB24A 1,88:1 Nicht bestanden

Aa #5A8BDE auf #844790 1,88:1 Nicht bestanden

Aa #DEADA5 auf #55927F 1,83:1 Nicht bestanden

Aa #DC6250 auf #DEADA5 1,80:1 Nicht bestanden

Aa #DC6250 auf #844790 1,80:1 Nicht bestanden

Aa #EEB24A auf #5A8BDE 1,80:1 Nicht bestanden

Aa #55927F auf #844790 1,77:1 Nicht bestanden

Aa #DEADA5 auf #5A8BDE 1,72:1 Nicht bestanden

Aa #21525A auf #272A32 1,65:1 Nicht bestanden

Aa #FFD183 auf #B89CE9 1,64:1 Nicht bestanden

Aa #DAD4C9 auf #B89CE9 1,59:1 Nicht bestanden

Aa #55927F auf #B89CE9 1,55:1 Nicht bestanden

Aa #DC6250 auf #B89CE9 1,52:1 Nicht bestanden

Aa #5A8BDE auf #B89CE9 1,45:1 Nicht bestanden

Aa #DEADA5 auf #FFD183 1,38:1 Nicht bestanden

Aa #21525A auf #844790 1,36:1 Nicht bestanden

Aa #DEADA5 auf #DAD4C9 1,34:1 Nicht bestanden

Aa #FFD183 auf #EEB24A 1,32:1 Nicht bestanden

Aa #DAD4C9 auf #EEB24A 1,28:1 Nicht bestanden

Aa #EEB24A auf #B89CE9 1,24:1 Nicht bestanden

Aa #DEADA5 auf #B89CE9 1,18:1 Nicht bestanden

Aa #2152A5 auf #844790 1,17:1 Nicht bestanden

Aa #21525A auf #2152A5 1,16:1 Nicht bestanden

Aa #55927F auf #5A8BDE 1,07:1 Nicht bestanden

Aa #DC6250 auf #5A8BDE 1,05:1 Nicht bestanden

Aa #DEADA5 auf #EEB24A 1,04:1 Nicht bestanden

Aa #DAD4C9 auf #FFD183 1,03:1 Nicht bestanden

Aa #DC6250 auf #55927F 1,02:1 Nicht bestanden

NostalgOS 12

NostalgOS 12

CSS-Variablen

Über diese Palette

Farben im Detail

Kontrast & Barrierefreiheit

Ähnliche Paletten

Schriftarten

Icons & SVG

Farben

Bilder

CSS-Tools

Entwicklung

Dokumentation

Unternehmen