Iconography

Material Symbols, sizes and how icons take their color.

• Interactive page: https://m3e.ljzapps.app/#foundations/iconography

Material Symbols is a variable icon font with weight, fill, grade and optical size axes. Use the rounded style with Expressive. In Compose use vector drawables generated from the symbols you need, or the icons artifact for prototypes. Avoid shipping the full font on mobile.

Common sizes: 18, 20, 24 (default), 32, 40 and 48 dp. Icons use LocalContentColor, which every Surface sets from its container role. Only set a tint for emphasis and use a color role.