Shapes
Material surfaces can be displayed in different shapes. Shapes direct attention, identify components, communicate state, and express brand.
The shape scale defines the style of container corners, offering a range of roundedness from square to fully circular.
There are different sizes of shapes:
Extra Small
Small
Medium
Large
Extra Large
You can customize the shape system for all components in the MaterialTheme or you can do it on a per component basis.
You can change the shape that a component has by overriding the shape parameter for that component. For example, by default, buttons use the shape style “full.” If your product requires a smaller amount of roundedness, you can override the shape parameter with a different shape value like MaterialTheme.shapes.small.
To learn more about shapes, see Material Design shapes.
Parameters
A shape style with 4 same-sized corners whose size are bigger than RectangleShape and smaller than Shapes.small. By default autocomplete menu, select menu, snackbars, standard menu, and text fields use this shape.
A shape style with 4 same-sized corners whose size are bigger than Shapes.extraSmall and smaller than Shapes.medium. By default chips use this shape.
A shape style with 4 same-sized corners whose size are bigger than Shapes.small and smaller than Shapes.large. By default cards and small FABs use this shape.
A shape style with 4 same-sized corners whose size are bigger than Shapes.medium and smaller than Shapes.extraLarge. By default extended FABs, FABs, and navigation drawers use this shape.
A shape style with 4 same-sized corners whose size are bigger than Shapes.large and smaller than CircleShape. By default large FABs use this shape.
Constructors
Functions
Returns a copy of this Shapes, optionally overriding some of the values.