Transitions Between States · A turns into B
Morph形变
- continuous
- clever
- unified
The same object changes shape, size or corner radius and continuously becomes another form, staying one element the whole way.
When to use it
Use it when the element keeps its identity and only its form changes, such as a button becoming an input; when the content itself changes, use “Crossfade”.
Parameters
300ms · ease-in-out · border-radius: 8px→24px + size animates in sync
Recipe
Morph → border-radius 8px → 24px @ 300ms ease-in-out
One sentence for your AI
Morph this button into an input on click: width, height and border-radius transition to a 24px radius over 300ms ease-in-out, keeping the same element alive.