This combination of a round floating action button and curved bottom app bar stands out from the rectangular shapes elsewhere on screen.

Emphasis example

Because unique shapes stand out, they can direct attention to different parts of a screen.


University of Michigan - Ann Arbor

Usage in UI

Material Design Documentation

Shape provides a way for users to recognize components and identify different Material surfaces.

* Example

Identity

You can communicate an element’s change of state by using a different shape from the rest of the elements or surfaces in that group. When using shape to indicate a state change, use it consistently with that state, in every instance it occurs.

* State example

State

To express a brand’s visual language throughout an app, use shape in tandem with other customizations (like color) in consistent ways. 

Small adjustments to shape, applied strategically through an app, contribute to the overall impression a brand makes.

* Branding example



Learn Before

Related

Learn After

Learn After

Related