Home/Help/Style/Appearance and blending

STYLE

Appearance and blending

Appearance sets how a layer is drawn over what is behind it: its opacity and its blending, and for shapes the paint order and the stroke style. Opacity has its own , so a layer can fade in and out.

The blue light fades out of the mix in two seconds and comes back as the animation starts over: screen blending and two Opacity keyframes.
WHAT YOU’LL MAKE

The blue light fades out of the mix in two seconds and comes back as the animation starts over: screen blending and two Opacity keyframes. This one is the real exported SVG, playing.

Do it in the editor: guided tour6 steps · about 3 minutes · opens a practice scene

Step by step

  1. Select the blue light

    Click Blue in the Layers panel.

  2. Blend it

    In Appearance, pick Screen in Blending. The red and green lights blend this way already: where the three overlap, their colours add up, to white in the middle.

  3. Start an Opacity track

    Click beside Opacity in Appearance. Opacity gets its own row on the timeline, with a keyframe at the playhead.

  4. Move the playhead to 2s

    Drag the red playhead along the time ruler to 2s.

  5. Fade it out

    Type 0 in Opacity and press Enter, or drag its slider all the way to the left. A keyframe lands at 2s, and the blue light is gone.

  6. Play it

    Press Space. The blue light fades out over two seconds, stays out until the end of the 3-second animation, and comes back as it starts over.

Good to know. This Opacity is the whole layer's; the fill and the stroke have their own, in Fill & stroke. Isolate, beside Blending, keeps the layers inside a group blending with each other only, not with what is behind the group. Order paints a shape's stroke under its fill instead of over it.

Keys

Shift OAdd an opacity keyframe at the playhead
SpacePlay and pause