Paper Garden

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

Zurück zur Bibliothek

Paper Garden

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

Bearbeiten

Gedeckt 12 Farben Warm Gemischt Analog muted novemberneutralpalettecontest garden

Likes 95

Farben 12

CSS-Variablen

:root {
  --c-muted-1: #392B35;
  --c-muted-2: #4A3345;
  --c-muted-3: #404F56;
  --c-muted-4: #566E5B;
  --c-muted-5: #788868;
  --c-muted-6: #B29585;
  --c-muted-7: #BDADAF;
  --c-muted-8: #838A9F;
  --c-muted-9: #6A6381;
  --c-muted-10: #61445E;
  --c-muted-11: #8F626F;
  --c-muted-12: #72424F;
}

Über diese Palette

Diese gedeckte Palette mit 12 Farben reicht vom hellsten Ton Moire (#BDADAF) bis zum dunkelsten Ton Valentino Nero (#392B35). Sie vereint Valentino Nero, Loulou, Lunar Eclipse, Green Bayou, Swedish Clover, Mexican Sand, Moire, Prophetic Sea, Purple Gumball, Grape Fizz, Mauve Taupe und Blood Rose in einem Set, das du direkt in deine Benutzeroberfläche übernehmen kannst. Farbpaare in der Palette: 66. Davon erreichen 3 die WCAG-AA-Kontrastschwelle (4,5:1) für Fließtext – am stärksten ist #392B35 auf #BDADAF mit 6,21:1.

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

Farben im Detail

Valentino Nero #392B35

RGB: rgb(57, 43, 53)
HSL: hsl(317, 14%, 20%)
Luminanz: 0,029

Loulou #4A3345

RGB: rgb(74, 51, 69)
HSL: hsl(313, 18%, 25%)
Luminanz: 0,043

Lunar Eclipse #404F56

RGB: rgb(64, 79, 86)
HSL: hsl(199, 15%, 29%)
Luminanz: 0,074

Green Bayou #566E5B

RGB: rgb(86, 110, 91)
HSL: hsl(133, 12%, 38%)
Luminanz: 0,139

Swedish Clover #788868

RGB: rgb(120, 136, 104)
HSL: hsl(90, 13%, 47%)
Luminanz: 0,226

Mexican Sand #B29585

RGB: rgb(178, 149, 133)
HSL: hsl(21, 23%, 61%)
Luminanz: 0,327

Moire #BDADAF

RGB: rgb(189, 173, 175)
HSL: hsl(353, 11%, 71%)
Luminanz: 0,438

Prophetic Sea #838A9F

RGB: rgb(131, 138, 159)
HSL: hsl(225, 13%, 57%)
Luminanz: 0,255

Purple Gumball #6A6381

RGB: rgb(106, 99, 129)
HSL: hsl(254, 13%, 45%)
Luminanz: 0,136

Grape Fizz #61445E

RGB: rgb(97, 68, 94)
HSL: hsl(306, 18%, 32%)
Luminanz: 0,075

Mauve Taupe #8F626F

RGB: rgb(143, 98, 111)
HSL: hsl(343, 19%, 47%)
Luminanz: 0,157

Blood Rose #72424F

RGB: rgb(114, 66, 79)
HSL: hsl(344, 27%, 35%)
Luminanz: 0,080

Kontrast & Barrierefreiheit

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

Aa #392B35 auf #BDADAF 6,21:1 AA

Aa #4A3345 auf #BDADAF 5,27:1 AA

Aa #392B35 auf #B29585 4,79:1 AA

Aa #4A3345 auf #B29585 4,07:1 AA (großer Text)

Aa #404F56 auf #BDADAF 3,95:1 AA (großer Text)

Aa #BDADAF auf #61445E 3,91:1 AA (großer Text)

Aa #392B35 auf #838A9F 3,88:1 AA (großer Text)

Aa #BDADAF auf #72424F 3,74:1 AA (großer Text)

Aa #392B35 auf #788868 3,51:1 AA (großer Text)

Aa #4A3345 auf #838A9F 3,30:1 AA (großer Text)

Aa #404F56 auf #B29585 3,05:1 AA (großer Text)

Aa #B29585 auf #61445E 3,02:1 AA (großer Text)

Aa #4A3345 auf #788868 2,98:1 Nicht bestanden

Aa #B29585 auf #72424F 2,89:1 Nicht bestanden

Aa #392B35 auf #8F626F 2,64:1 Nicht bestanden

Aa #BDADAF auf #6A6381 2,63:1 Nicht bestanden

Aa #566E5B auf #BDADAF 2,58:1 Nicht bestanden

Aa #404F56 auf #838A9F 2,47:1 Nicht bestanden

Aa #838A9F auf #61445E 2,44:1 Nicht bestanden

Aa #392B35 auf #566E5B 2,40:1 Nicht bestanden

Aa #392B35 auf #6A6381 2,36:1 Nicht bestanden

Aa #BDADAF auf #8F626F 2,35:1 Nicht bestanden

Aa #838A9F auf #72424F 2,34:1 Nicht bestanden

Aa #4A3345 auf #8F626F 2,24:1 Nicht bestanden

Aa #404F56 auf #788868 2,23:1 Nicht bestanden

Aa #788868 auf #61445E 2,21:1 Nicht bestanden

Aa #788868 auf #72424F 2,12:1 Nicht bestanden

Aa #4A3345 auf #566E5B 2,04:1 Nicht bestanden

Aa #B29585 auf #6A6381 2,03:1 Nicht bestanden

Aa #4A3345 auf #6A6381 2,01:1 Nicht bestanden

Aa #566E5B auf #B29585 1,99:1 Nicht bestanden

Aa #B29585 auf #8F626F 1,82:1 Nicht bestanden

Aa #788868 auf #BDADAF 1,77:1 Nicht bestanden

Aa #404F56 auf #8F626F 1,68:1 Nicht bestanden

Aa #392B35 auf #72424F 1,66:1 Nicht bestanden

Aa #61445E auf #8F626F 1,66:1 Nicht bestanden

Aa #838A9F auf #6A6381 1,64:1 Nicht bestanden

Aa #566E5B auf #838A9F 1,62:1 Nicht bestanden

Aa #BDADAF auf #838A9F 1,60:1 Nicht bestanden

Aa #392B35 auf #61445E 1,59:1 Nicht bestanden

Aa #8F626F auf #72424F 1,59:1 Nicht bestanden

Aa #392B35 auf #404F56 1,57:1 Nicht bestanden

Aa #404F56 auf #566E5B 1,53:1 Nicht bestanden

Aa #566E5B auf #61445E 1,51:1 Nicht bestanden

Aa #404F56 auf #6A6381 1,50:1 Nicht bestanden

Aa #788868 auf #6A6381 1,49:1 Nicht bestanden

Aa #6A6381 auf #61445E 1,49:1 Nicht bestanden

Aa #838A9F auf #8F626F 1,47:1 Nicht bestanden

Aa #566E5B auf #788868 1,46:1 Nicht bestanden

Aa #566E5B auf #72424F 1,45:1 Nicht bestanden

Aa #6A6381 auf #72424F 1,42:1 Nicht bestanden

Aa #4A3345 auf #72424F 1,41:1 Nicht bestanden

Aa #788868 auf #B29585 1,36:1 Nicht bestanden

Aa #4A3345 auf #61445E 1,35:1 Nicht bestanden

Aa #4A3345 auf #404F56 1,34:1 Nicht bestanden

Aa #788868 auf #8F626F 1,33:1 Nicht bestanden

Aa #B29585 auf #BDADAF 1,30:1 Nicht bestanden

Aa #B29585 auf #838A9F 1,23:1 Nicht bestanden

Aa #392B35 auf #4A3345 1,18:1 Nicht bestanden

Aa #6A6381 auf #8F626F 1,12:1 Nicht bestanden

Aa #788868 auf #838A9F 1,11:1 Nicht bestanden

Aa #566E5B auf #8F626F 1,10:1 Nicht bestanden

Aa #404F56 auf #72424F 1,06:1 Nicht bestanden

Aa #61445E auf #72424F 1,04:1 Nicht bestanden

Aa #566E5B auf #6A6381 1,02:1 Nicht bestanden

Aa #404F56 auf #61445E 1,01:1 Nicht bestanden

Paper Garden

Paper Garden

CSS-Variablen

Über diese Palette

Farben im Detail

Kontrast & Barrierefreiheit

Ähnliche Paletten

Schriftarten

Icons & SVG

Farben

Bilder

CSS-Tools

Entwicklung

Dokumentation

Unternehmen