---
url: /styles/shape/shape-morph.md
description: >-
  The M3 shape system includes original shapes, a corner radius scale, and
  built-in shape morphing
---

# Shape

The M3 shape system includes original shapes, a corner radius scale, and built-in shape morphing

[Overview & principles](overview-principles.md) · [Corner radius scale](corner-radius-scale.md) · **Shape morph**

The Material shape library supports easy transitioning, or morphing, between shapes. Shape morph is leveraged in the [standard button group](../../components/button-groups/overview.md "Standard button groups add interactions between adjacent buttons when they're pressed.") and [loading indicator](../../components/loading-indicator/overview.md "Loading indicators show the progress of a process with a short wait time.") components.

## Using shape morph

Access to the Material shape library and the shape morph functionality are available through a platform-specific API.<br>

* For Android, use the [Shapes in Compose API](https://developer.android.com/reference/kotlin/androidx/compose/material3/MaterialShapes)
* Web is not currently available

Shape morphing uses the [expressive motion scheme](../motion/overview/how-it-works.md "The motion physics system has two schemes: standard for utilitarian movement, and expressive for more bouncy movement.") by default. This can be switched to the standard motion scheme as needed.

<video controls src="https://firebasestorage.googleapis.com/v0/b/design-spec/o/projects%2Fgoogle-material-3%2Fimages%2Fm0f9yqna-11-shape_Shape%20morph%201.mp4?alt=media" aria-label="Shapes available in the shape morph API library."></video>

The Material shape library contains many types of shapes that can all morph seamlessly into each other

Material uses shape morphing in the [standard button group ](../../components/button-groups/overview.md "Standard button groups add interactions between adjacent buttons when they're pressed.")and [loading indicator](../../components/loading-indicator/overview.md "Loading indicators show the progress of a process with a short wait time.") components.

<video controls src="https://firebasestorage.googleapis.com/v0/b/design-spec/o/projects%2Fgoogle-material-3%2Fimages%2Fm0fa2ql9-12%20-%20Shape%20Morph%202.mp4?alt=media" aria-label="Morphing buttons react to user clicking."></video>

The standard button group uses shape morph to show interaction

<video controls src="https://firebasestorage.googleapis.com/v0/b/design-spec/o/projects%2Fgoogle-material-3%2Fimages%2Fm0faip5r-13%20-%20Shape%20Morph%203.mp4?alt=media" aria-label="Loading indicator with shape morph."></video>

The loading indicator uses shape morph to show progress