Rainy Day

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

Zurück zur Bibliothek

Rainy Day

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

Bearbeiten

Erdig 12 Farben Warm Gemischt Komplementär warm cool natural rain

Likes 20

Farben 12

CSS-Variablen

:root {
  --c-earthy-1: #F1A27A;
  --c-earthy-2: #E64545;
  --c-earthy-3: #A81660;
  --c-earthy-4: #B9D2D3;
  --c-earthy-5: #6C8E8A;
  --c-earthy-6: #222325;
  --c-earthy-7: #FFEFAB;
  --c-earthy-8: #F1CF3A;
  --c-earthy-9: #BE8829;
  --c-earthy-10: #7BDC51;
  --c-earthy-11: #29BE6C;
  --c-earthy-12: #067962;
}

Über diese Palette

Diese erdige Palette mit 12 Farben reicht vom hellsten Ton Transparent Yellow (#FFEFAB) bis zum dunkelsten Ton Verified Black (#222325). Sie vereint Balinese Sunset, Vermilion Cinnabar, Plum Paradise, Relax, Aspen Hush, Verified Black, Transparent Yellow, Giallo, Gordal Olive, Lilliputian Lime, Welsh Onion und Ultramarine Green 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 #222325 auf #FFEFAB mit 13,62: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

Balinese Sunset #F1A27A

RGB: rgb(241, 162, 122)
HSL: hsl(20, 81%, 71%)
Luminanz: 0,460

Vermilion Cinnabar #E64545

RGB: rgb(230, 69, 69)
HSL: hsl(0, 76%, 59%)
Luminanz: 0,215

Plum Paradise #A81660

RGB: rgb(168, 22, 96)
HSL: hsl(330, 77%, 37%)
Luminanz: 0,097

Relax #B9D2D3

RGB: rgb(185, 210, 211)
HSL: hsl(182, 23%, 78%)
Luminanz: 0,611

Aspen Hush #6C8E8A

RGB: rgb(108, 142, 138)
HSL: hsl(173, 14%, 49%)
Luminanz: 0,244

Verified Black #222325

RGB: rgb(34, 35, 37)
HSL: hsl(220, 4%, 14%)
Luminanz: 0,017

Transparent Yellow #FFEFAB

RGB: rgb(255, 239, 171)
HSL: hsl(49, 100%, 84%)
Luminanz: 0,859

Giallo #F1CF3A

RGB: rgb(241, 207, 58)
HSL: hsl(49, 87%, 59%)
Luminanz: 0,636

Gordal Olive #BE8829

RGB: rgb(190, 136, 41)
HSL: hsl(38, 65%, 45%)
Luminanz: 0,287

Lilliputian Lime #7BDC51

RGB: rgb(123, 220, 81)
HSL: hsl(102, 67%, 59%)
Luminanz: 0,560

Welsh Onion #29BE6C

RGB: rgb(41, 190, 108)
HSL: hsl(147, 65%, 45%)
Luminanz: 0,384

Ultramarine Green #067962

RGB: rgb(6, 121, 98)
HSL: hsl(168, 91%, 25%)
Luminanz: 0,146

Kontrast & Barrierefreiheit

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

Aa #222325 auf #FFEFAB 13,62:1 AAA

Aa #222325 auf #F1CF3A 10,28:1 AAA

Aa #B9D2D3 auf #222325 9,90:1 AAA

Aa #222325 auf #7BDC51 9,14:1 AAA

Aa #F1A27A auf #222325 7,63:1 AAA

Aa #222325 auf #29BE6C 6,50:1 AA

Aa #A81660 auf #FFEFAB 6,17:1 AA

Aa #222325 auf #BE8829 5,05:1 AA

Aa #A81660 auf #F1CF3A 4,66:1 AA

Aa #FFEFAB auf #067962 4,64:1 AA

Aa #A81660 auf #B9D2D3 4,48:1 AA (großer Text)

Aa #6C8E8A auf #222325 4,40:1 AA (großer Text)

Aa #A81660 auf #7BDC51 4,14:1 AA (großer Text)

Aa #E64545 auf #222325 3,97:1 AA (großer Text)

Aa #F1CF3A auf #067962 3,50:1 AA (großer Text)

Aa #F1A27A auf #A81660 3,46:1 AA (großer Text)

Aa #E64545 auf #FFEFAB 3,43:1 AA (großer Text)

Aa #B9D2D3 auf #067962 3,37:1 AA (großer Text)

Aa #7BDC51 auf #067962 3,11:1 AA (großer Text)

Aa #6C8E8A auf #FFEFAB 3,10:1 AA (großer Text)

Aa #A81660 auf #29BE6C 2,94:1 Nicht bestanden

Aa #222325 auf #067962 2,94:1 Nicht bestanden

Aa #FFEFAB auf #BE8829 2,70:1 Nicht bestanden

Aa #F1A27A auf #067962 2,60:1 Nicht bestanden

Aa #E64545 auf #F1CF3A 2,59:1 Nicht bestanden

Aa #E64545 auf #B9D2D3 2,49:1 Nicht bestanden

Aa #6C8E8A auf #F1CF3A 2,34:1 Nicht bestanden

Aa #E64545 auf #7BDC51 2,30:1 Nicht bestanden

Aa #A81660 auf #BE8829 2,29:1 Nicht bestanden

Aa #B9D2D3 auf #6C8E8A 2,25:1 Nicht bestanden

Aa #A81660 auf #222325 2,21:1 Nicht bestanden

Aa #29BE6C auf #067962 2,21:1 Nicht bestanden

Aa #FFEFAB auf #29BE6C 2,10:1 Nicht bestanden

Aa #6C8E8A auf #7BDC51 2,08:1 Nicht bestanden

Aa #F1CF3A auf #BE8829 2,04:1 Nicht bestanden

Aa #A81660 auf #6C8E8A 1,99:1 Nicht bestanden

Aa #B9D2D3 auf #BE8829 1,96:1 Nicht bestanden

Aa #F1A27A auf #E64545 1,92:1 Nicht bestanden

Aa #BE8829 auf #7BDC51 1,81:1 Nicht bestanden

Aa #E64545 auf #A81660 1,80:1 Nicht bestanden

Aa #F1A27A auf #FFEFAB 1,78:1 Nicht bestanden

Aa #F1A27A auf #6C8E8A 1,73:1 Nicht bestanden

Aa #BE8829 auf #067962 1,72:1 Nicht bestanden

Aa #E64545 auf #29BE6C 1,64:1 Nicht bestanden

Aa #F1CF3A auf #29BE6C 1,58:1 Nicht bestanden

Aa #B9D2D3 auf #29BE6C 1,52:1 Nicht bestanden

Aa #F1A27A auf #BE8829 1,51:1 Nicht bestanden

Aa #6C8E8A auf #067962 1,50:1 Nicht bestanden

Aa #FFEFAB auf #7BDC51 1,49:1 Nicht bestanden

Aa #6C8E8A auf #29BE6C 1,48:1 Nicht bestanden

Aa #7BDC51 auf #29BE6C 1,41:1 Nicht bestanden

Aa #B9D2D3 auf #FFEFAB 1,38:1 Nicht bestanden

Aa #F1A27A auf #F1CF3A 1,35:1 Nicht bestanden

Aa #E64545 auf #067962 1,35:1 Nicht bestanden

Aa #A81660 auf #067962 1,33:1 Nicht bestanden

Aa #FFEFAB auf #F1CF3A 1,32:1 Nicht bestanden

Aa #F1A27A auf #B9D2D3 1,30:1 Nicht bestanden

Aa #BE8829 auf #29BE6C 1,29:1 Nicht bestanden

Aa #E64545 auf #BE8829 1,27:1 Nicht bestanden

Aa #F1A27A auf #7BDC51 1,20:1 Nicht bestanden

Aa #F1A27A auf #29BE6C 1,17:1 Nicht bestanden

Aa #6C8E8A auf #BE8829 1,15:1 Nicht bestanden

Aa #F1CF3A auf #7BDC51 1,13:1 Nicht bestanden

Aa #E64545 auf #6C8E8A 1,11:1 Nicht bestanden

Aa #B9D2D3 auf #7BDC51 1,08:1 Nicht bestanden

Aa #B9D2D3 auf #F1CF3A 1,04:1 Nicht bestanden

Rainy Day

Rainy Day

CSS-Variablen

Über diese Palette

Farben im Detail

Kontrast & Barrierefreiheit

Ähnliche Paletten

Schriftarten

Icons & SVG

Farben

Bilder

CSS-Tools

Entwicklung

Dokumentation

Unternehmen