Shape keys and morphing
Edit a path at another time and the shape morphs between the two, like shape keys in 3D tools.
A path can change shape over time. Each shape you set at a moment is a shape keyframe; EaseKit morphs smoothly between them. It's how a play icon turns into a pause icon, or a blob breathes.
- Select a path and enter vector mode (⇧⌘P).
- Move the playhead to a later time.
- Move some points. EaseKit adds a shape keyframe at the playhead.
- Play: the shape morphs from the first shape to the second.
Use Previous shape keyframe and Next shape keyframe in the vector toolbar to jump between them. Shape keyframes also appear in the timeline, where you can move them and change their curve like any other keyframe.
Where morphs play
| Export | Morph |
|---|---|
| Video, GIF, PNG, HTML, Web Animations, React | Yes |
| Lottie | Yes, as an animated Lottie path |
| CSS | Yes in Chrome and Firefox; Safari keeps the first shape |
| SwiftUI | No: the file uses the first key's shape, with a comment |