M3 Expressive: Design with emotion
Build more usable and engaging products with emotion-driven UX. M3 Expressive adds vibrant colors, intuitive motion, adaptive components, flexible typography, and contrasting shapes.
Updated: Figma M3 Design KitQuickly create design mockups and prototypes with the latest Material 3 Expressive components and styles
New: Motion physicsEasier-to-implement motion system for more customizable transitions—powered by tokens
Expanded: Shape libraryNew set of 35 shapes to add decorative visual elements, with built-in shape morph motion
Blog: Guide to our latest updateGet a full introduction to the latest evolution of Material, including new components and style updates
Blog: Research InsightsDive into the three years of research that influenced the evolution of Material Design’s Expressive update
Expressive components
New: ToolbarsFlexible component to display frequently used actions. Toolbars hold a variety of controls like buttons, and can also be paired with a FAB.
New: Split buttonPair a button with related actions in a connected menu. Split buttons leverage expressive shape and motion strategies.
Updated: Progress indicatorsAn eye-catching way to show the status of a process in real time. Customize waveform and thickness to show progress with style.
New: Button groupsA new way to organize related buttons—with shape-shifting buttons that bump and react to each other
See all expressive componentsCheck out all 15 new and updated M3 Expressive components
Popular resources
Material blogNews, tutorials, and inspiration from the Material team
Figma M3 Design KitCustomizable styles and components to help you design with Material 3
Get startedGuides, videos, and tools to start building with Material
DevelopCode and developer documentation for building with Material