Keyframes and tracks
Every property in the inspector can be animated. Start a track on it with , then change the value at another time: a keyframe lands under the playhead, and the editor fills in everything between.
The sun turns a quarter in two seconds, rests for a second, and starts over: two keyframes on one track. This one is the real exported SVG, playing.
Step by step
Select the sun
Click the sun on the canvas, or its row in the Layers panel. The inspector shows everything you can set on it.
Start a track
Click beside Rotate. Rotate gets its own row on the timeline, with a keyframe at the playhead, and the diamond turns amber.
Move the playhead
Drag the red playhead along the time ruler to 2s. The inspector now shows the values at that moment.
Change the value
Type 90 in Rotate and press Enter, or drag its label. A second keyframe appears at 2s, and the sun turns on the canvas.
Play it
Press Space. The sun turns until 2s, rests until the end of the 3-second animation, and starts over. To change how it moves between two keys, see Easing.
Keys
| Shift P | Add a position keyframe at the playhead |
| Shift R | Add a rotate keyframe at the playhead |
| Shift S | Add a scale keyframe at the playhead |
| Shift O | Add an opacity keyframe at the playhead |
| J K | Jump to the previous or next keyframe |
| Space | Play and pause |