Hergestellt in 06/09/2025 16:10
Material Design Interaction Layers
- Elevation Gray#eceff1
- Ripple Blue#42a5f5
- Touchpoint Amber#ffc107
- Toolbar Graphite#212121
- Snack Red#ef5350
- Dialog Cream#fff8e1
Die Palette besteht aus Licht, Dunkel-Farben. Akzentfarben Ripple Blue #42a5f5 und Dialog Cream #fff8e1. Palette hat Farbtemperatur Neutral, Kalt, Warm.
Nach Helligkeit reicht diese Palette von #212121 (dunkelstes) bis #FFF8E1 (hellstes). Die Helligkeitsspanne ist groß.
Die Sättigung wirkt insgesamt lebhaft (höhere Chroma).
Manche Farbton-Paare liegen nahe Komplementärpositionen — kann wie Komplementärkontrast wirken (heuristisch).
In der Gesamttemperatur neigen die Felder zur warmen Seite.
HEX-Codes (sortiert): #212121, #42A5F5, #ECEFF1, #EF5350, #FFC107, #FFF8E1
Die Palette Material Design Interaction Layers enthält eine Kombination aus 6-Codefarben:
VERHEXEN: #eceff1, RGB: (236, 239, 241); VERHEXEN: #42a5f5, RGB: (66, 165, 245); VERHEXEN: #ffc107, RGB: (255, 193, 7)
VERHEXEN: #212121, RGB: (33, 33, 33); VERHEXEN: #ef5350, RGB: (239, 83, 80); VERHEXEN: #fff8e1, RGB: (255, 248, 225)
Vereinfachte Version der Palettenfarben
Farbton von whitesmoke, Schatten von dodgerblue, Farbton von gold, Schatten von Schwarz, Schatten von indianred, Schatten von cornsilk
Farbschema wurde erstellt von colorslib
Farbcodes in der Palette
Material Design Interaction Layers Farbcodes HEX, RGB-Informationen in der Tabelle
| Farbe | VERHEXEN | RGB | Name | alternativer Name |
| #eceff1 | #eceff1 | RGB(236, 239, 241) | Elevation Gray | — |
| #42a5f5 | #42a5f5 | RGB(66, 165, 245) | Ripple Blue | — |
| #ffc107 | #ffc107 | RGB(255, 193, 7) | Touchpoint Amber | — |
| #212121 | #212121 | RGB(33, 33, 33) | Toolbar Graphite | Lead |
| #ef5350 | #ef5350 | RGB(239, 83, 80) | Snack Red | — |
| #fff8e1 | #fff8e1 | RGB(255, 248, 225) | Dialog Cream | Still Morning |
Farbpalette Kontrast
5 Farbpaare haben einen niedrigen Kontrast und müssen verbessert werden, was die Lesbarkeit beeinträchtigen kann.
| Tekst kleur | Achtergrond kleur | contrast ratio |
#eceff1 | #ffc107 | 1.41 |
#eceff1 | #fff8e1 | 1.08 |
#42a5f5 | #ffc107 | 1.62 |
#42a5f5 | #ef5350 | 1.31 |
#ffc107 | #fff8e1 | 1.53 |
Bildpalette Material Design Interaction Layers png
Palette exportieren
Laden Sie die "Material Design Interaction Layers" in mehreren Formaten herunter, um sie nahtlos in Ihre Designprojekte zu integrieren.
Verfügbare Formate: