Waxun

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

Zurück zur Bibliothek

Waxun

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

Bearbeiten

Erdig 9 Farben Kühl Gemischt Komplementär warm summer grid heat

Likes 27

Farben 9

CSS-Variablen

:root {
  --c-earthy-1: #3E9870;
  --c-earthy-2: #74D3D1;
  --c-earthy-3: #CEF3A2;
  --c-earthy-4: #244297;
  --c-earthy-5: #657F8E;
  --c-earthy-6: #DA933E;
  --c-earthy-7: #2C0445;
  --c-earthy-8: #5B3232;
  --c-earthy-9: #A64438;
}

Über diese Palette

Diese erdige Palette mit 9 Farben reicht vom hellsten Ton Reef Refractions (#CEF3A2) bis zum dunkelsten Ton Edge of Space (#2C0445). Sie vereint Ocean Green, Soft Turquoise, Reef Refractions, Cascade Twilight, Pier 17 Steel, Hint of Caramel, Edge of Space, Arresting Auburn und Red Revival in einem Set, das du direkt in deine Benutzeroberfläche übernehmen kannst. Farbpaare in der Palette: 36. Davon erreichen 9 die WCAG-AA-Kontrastschwelle (4,5:1) für Fließtext – am stärksten ist #CEF3A2 auf #2C0445 mit 14,02: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

Ocean Green #3E9870

RGB: rgb(62, 152, 112)
HSL: hsl(153, 42%, 42%)
Luminanz: 0,247

Soft Turquoise #74D3D1

RGB: rgb(116, 211, 209)
HSL: hsl(179, 52%, 64%)
Luminanz: 0,549

Reef Refractions #CEF3A2

RGB: rgb(206, 243, 162)
HSL: hsl(87, 77%, 79%)
Luminanz: 0,798

Cascade Twilight #244297

RGB: rgb(36, 66, 151)
HSL: hsl(224, 61%, 37%)
Luminanz: 0,065

Pier 17 Steel #657F8E

RGB: rgb(101, 127, 142)
HSL: hsl(202, 17%, 48%)
Luminanz: 0,199

Hint of Caramel #DA933E

RGB: rgb(218, 147, 62)
HSL: hsl(33, 68%, 55%)
Luminanz: 0,361

Edge of Space #2C0445

RGB: rgb(44, 4, 69)
HSL: hsl(277, 89%, 14%)
Luminanz: 0,011

Arresting Auburn #5B3232

RGB: rgb(91, 50, 50)
HSL: hsl(0, 29%, 28%)
Luminanz: 0,047

Red Revival #A64438

RGB: rgb(166, 68, 56)
HSL: hsl(7, 50%, 44%)
Luminanz: 0,125

Kontrast & Barrierefreiheit

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

Aa #CEF3A2 auf #2C0445 14,02:1 AAA

Aa #74D3D1 auf #2C0445 9,90:1 AAA

Aa #CEF3A2 auf #5B3232 8,71:1 AAA

Aa #CEF3A2 auf #244297 7,37:1 AAA

Aa #DA933E auf #2C0445 6,79:1 AA

Aa #74D3D1 auf #5B3232 6,15:1 AA

Aa #74D3D1 auf #244297 5,21:1 AA

Aa #3E9870 auf #2C0445 4,90:1 AA

Aa #CEF3A2 auf #A64438 4,84:1 AA

Aa #DA933E auf #5B3232 4,22:1 AA (großer Text)

Aa #657F8E auf #2C0445 4,11:1 AA (großer Text)

Aa #244297 auf #DA933E 3,57:1 AA (großer Text)

Aa #74D3D1 auf #A64438 3,42:1 AA (großer Text)

Aa #CEF3A2 auf #657F8E 3,41:1 AA (großer Text)

Aa #3E9870 auf #5B3232 3,05:1 AA (großer Text)

Aa #2C0445 auf #A64438 2,90:1 Nicht bestanden

Aa #3E9870 auf #CEF3A2 2,86:1 Nicht bestanden

Aa #3E9870 auf #244297 2,58:1 Nicht bestanden

Aa #657F8E auf #5B3232 2,56:1 Nicht bestanden

Aa #74D3D1 auf #657F8E 2,41:1 Nicht bestanden

Aa #DA933E auf #A64438 2,35:1 Nicht bestanden

Aa #244297 auf #657F8E 2,16:1 Nicht bestanden

Aa #CEF3A2 auf #DA933E 2,06:1 Nicht bestanden

Aa #3E9870 auf #74D3D1 2,02:1 Nicht bestanden

Aa #244297 auf #2C0445 1,90:1 Nicht bestanden

Aa #5B3232 auf #A64438 1,80:1 Nicht bestanden

Aa #3E9870 auf #A64438 1,69:1 Nicht bestanden

Aa #657F8E auf #DA933E 1,65:1 Nicht bestanden

Aa #2C0445 auf #5B3232 1,61:1 Nicht bestanden

Aa #244297 auf #A64438 1,52:1 Nicht bestanden

Aa #74D3D1 auf #DA933E 1,46:1 Nicht bestanden

Aa #74D3D1 auf #CEF3A2 1,42:1 Nicht bestanden

Aa #657F8E auf #A64438 1,42:1 Nicht bestanden

Aa #3E9870 auf #DA933E 1,39:1 Nicht bestanden

Aa #3E9870 auf #657F8E 1,19:1 Nicht bestanden

Aa #244297 auf #5B3232 1,18:1 Nicht bestanden

Waxun

Waxun

CSS-Variablen

Über diese Palette

Farben im Detail

Kontrast & Barrierefreiheit

Ähnliche Paletten

Schriftarten

Icons & SVG

Farben

Bilder

CSS-Tools

Entwicklung

Dokumentation

Unternehmen