Back to Animations
Morph Transition
形态过渡
Element smoothly morphs between two states, transitioning size, border-radius, and color simultaneously.
TransitionContinuousAdvanced
Preview
Code
Duration
600ms
Easing
cubic-bezier(0.4, 0, 0.2, 1)
CSS Properties
border-radius, width, height, background-color
Use Cases
- Button state transitions
- Card expand/collapse morph
- Navigation indicator morph
- Toggle switch animation