Summer Cream

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

Zurück zur Bibliothek

Summer Cream

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

Bearbeiten

Erdig 12 Farben Warm Gemischt Komplementär pastel cream summer summercream

Likes 40

Farben 12

CSS-Variablen

:root {
  --c-earthy-1: #361D2B;
  --c-earthy-2: #4F304A;
  --c-earthy-3: #7061CF;
  --c-earthy-4: #ADB8F0;
  --c-earthy-5: #7AD6B7;
  --c-earthy-6: #BBF2CF;
  --c-earthy-7: #D67C99;
  --c-earthy-8: #F2B3B3;
  --c-earthy-9: #FFDFA3;
  --c-earthy-10: #FFFCBA;
  --c-earthy-11: #C9C4A7;
  --c-earthy-12: #FAF8ED;
}

Über diese Palette

Diese erdige Palette mit 12 Farben reicht vom hellsten Ton Break of Day (#FFFCBA) bis zum dunkelsten Ton Antique Burgundy (#361D2B). Sie vereint Antique Burgundy, Grimace, Astro Purple, Perano, Seafoam Blue, Mystery Mint, Little Bow Pink, Jaguar Rose, Cape Honey, Break of Day, Cargo Green und Night Blooming Jasmine in einem Set, das du direkt in deine Benutzeroberfläche übernehmen kannst. Farbpaare in der Palette: 66. Davon erreichen 19 die WCAG-AA-Kontrastschwelle (4,5:1) für Fließtext – am stärksten ist #361D2B auf #FFFCBA mit 14,54: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

Antique Burgundy #361D2B

RGB: rgb(54, 29, 43)
HSL: hsl(326, 30%, 16%)
Luminanz: 0,018

Grimace #4F304A

RGB: rgb(79, 48, 74)
HSL: hsl(310, 24%, 25%)
Luminanz: 0,043

Astro Purple #7061CF

RGB: rgb(112, 97, 207)
HSL: hsl(248, 53%, 60%)
Luminanz: 0,165

Perano #ADB8F0

RGB: rgb(173, 184, 240)
HSL: hsl(230, 69%, 81%)
Luminanz: 0,495

Seafoam Blue #7AD6B7

RGB: rgb(122, 214, 183)
HSL: hsl(160, 53%, 66%)
Luminanz: 0,557

Mystery Mint #BBF2CF

RGB: rgb(187, 242, 207)
HSL: hsl(142, 68%, 84%)
Luminanz: 0,786

Little Bow Pink #D67C99

RGB: rgb(214, 124, 153)
HSL: hsl(341, 52%, 66%)
Luminanz: 0,310

Jaguar Rose #F2B3B3

RGB: rgb(242, 179, 179)
HSL: hsl(0, 71%, 83%)
Luminanz: 0,544

Cape Honey #FFDFA3

RGB: rgb(255, 223, 163)
HSL: hsl(39, 100%, 82%)
Luminanz: 0,767

Break of Day #FFFCBA

RGB: rgb(255, 252, 186)
HSL: hsl(57, 100%, 86%)
Luminanz: 0,944

Cargo Green #C9C4A7

RGB: rgb(201, 196, 167)
HSL: hsl(51, 24%, 72%)
Luminanz: 0,547

Night Blooming Jasmine #FAF8ED

RGB: rgb(250, 248, 237)
HSL: hsl(51, 57%, 95%)
Luminanz: 0,936

Kontrast & Barrierefreiheit

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

Aa #361D2B auf #FFFCBA 14,54:1 AAA

Aa #361D2B auf #FAF8ED 14,42:1 AAA

Aa #361D2B auf #BBF2CF 12,22:1 AAA

Aa #361D2B auf #FFDFA3 11,95:1 AAA

Aa #4F304A auf #FFFCBA 10,72:1 AAA

Aa #4F304A auf #FAF8ED 10,63:1 AAA

Aa #4F304A auf #BBF2CF 9,01:1 AAA

Aa #361D2B auf #7AD6B7 8,87:1 AAA

Aa #4F304A auf #FFDFA3 8,81:1 AAA

Aa #361D2B auf #C9C4A7 8,73:1 AAA

Aa #361D2B auf #F2B3B3 8,68:1 AAA

Aa #361D2B auf #ADB8F0 7,96:1 AAA

Aa #4F304A auf #7AD6B7 6,54:1 AA

Aa #4F304A auf #C9C4A7 6,44:1 AA

Aa #4F304A auf #F2B3B3 6,40:1 AA

Aa #4F304A auf #ADB8F0 5,87:1 AA

Aa #361D2B auf #D67C99 5,27:1 AA

Aa #7061CF auf #FFFCBA 4,62:1 AA

Aa #7061CF auf #FAF8ED 4,58:1 AA

Aa #7061CF auf #BBF2CF 3,89:1 AA (großer Text)

Aa #4F304A auf #D67C99 3,88:1 AA (großer Text)

Aa #7061CF auf #FFDFA3 3,80:1 AA (großer Text)

Aa #361D2B auf #7061CF 3,14:1 AA (großer Text)

Aa #7061CF auf #7AD6B7 2,82:1 Nicht bestanden

Aa #7061CF auf #C9C4A7 2,78:1 Nicht bestanden

Aa #7061CF auf #F2B3B3 2,76:1 Nicht bestanden

Aa #D67C99 auf #FFFCBA 2,76:1 Nicht bestanden

Aa #D67C99 auf #FAF8ED 2,74:1 Nicht bestanden

Aa #7061CF auf #ADB8F0 2,53:1 Nicht bestanden

Aa #4F304A auf #7061CF 2,32:1 Nicht bestanden

Aa #BBF2CF auf #D67C99 2,32:1 Nicht bestanden

Aa #D67C99 auf #FFDFA3 2,27:1 Nicht bestanden

Aa #ADB8F0 auf #FFFCBA 1,83:1 Nicht bestanden

Aa #ADB8F0 auf #FAF8ED 1,81:1 Nicht bestanden

Aa #7061CF auf #D67C99 1,68:1 Nicht bestanden

Aa #7AD6B7 auf #D67C99 1,68:1 Nicht bestanden

Aa #F2B3B3 auf #FFFCBA 1,67:1 Nicht bestanden

Aa #FFFCBA auf #C9C4A7 1,67:1 Nicht bestanden

Aa #D67C99 auf #C9C4A7 1,66:1 Nicht bestanden

Aa #F2B3B3 auf #FAF8ED 1,66:1 Nicht bestanden

Aa #D67C99 auf #F2B3B3 1,65:1 Nicht bestanden

Aa #C9C4A7 auf #FAF8ED 1,65:1 Nicht bestanden

Aa #7AD6B7 auf #FFFCBA 1,64:1 Nicht bestanden

Aa #7AD6B7 auf #FAF8ED 1,63:1 Nicht bestanden

Aa #ADB8F0 auf #BBF2CF 1,53:1 Nicht bestanden

Aa #ADB8F0 auf #D67C99 1,51:1 Nicht bestanden

Aa #ADB8F0 auf #FFDFA3 1,50:1 Nicht bestanden

Aa #BBF2CF auf #F2B3B3 1,41:1 Nicht bestanden

Aa #BBF2CF auf #C9C4A7 1,40:1 Nicht bestanden

Aa #7AD6B7 auf #BBF2CF 1,38:1 Nicht bestanden

Aa #F2B3B3 auf #FFDFA3 1,38:1 Nicht bestanden

Aa #FFDFA3 auf #C9C4A7 1,37:1 Nicht bestanden

Aa #361D2B auf #4F304A 1,36:1 Nicht bestanden

Aa #7AD6B7 auf #FFDFA3 1,35:1 Nicht bestanden

Aa #FFDFA3 auf #FFFCBA 1,22:1 Nicht bestanden

Aa #FFDFA3 auf #FAF8ED 1,21:1 Nicht bestanden

Aa #BBF2CF auf #FFFCBA 1,19:1 Nicht bestanden

Aa #BBF2CF auf #FAF8ED 1,18:1 Nicht bestanden

Aa #ADB8F0 auf #7AD6B7 1,11:1 Nicht bestanden

Aa #ADB8F0 auf #C9C4A7 1,10:1 Nicht bestanden

Aa #ADB8F0 auf #F2B3B3 1,09:1 Nicht bestanden

Aa #7AD6B7 auf #F2B3B3 1,02:1 Nicht bestanden

Aa #7AD6B7 auf #C9C4A7 1,02:1 Nicht bestanden

Aa #BBF2CF auf #FFDFA3 1,02:1 Nicht bestanden

Aa #F2B3B3 auf #C9C4A7 1,01:1 Nicht bestanden

Aa #FFFCBA auf #FAF8ED 1,01:1 Nicht bestanden

Summer Cream

Summer Cream

CSS-Variablen

Über diese Palette

Farben im Detail

Kontrast & Barrierefreiheit

Ähnliche Paletten

Schriftarten

Icons & SVG

Farben

Bilder

CSS-Tools

Entwicklung

Dokumentation

Unternehmen