Spinel’s Styling API is used to declare how layers are rendered.

Group and layer effects are driven by short sequences of styling operators.

Spinel Effect Scripts are executed near the end of the Spinel pipeline and can be altered as often as required.

This post will focus on the soft mask coverage operator.

Soft masks are clipping masks with subpixel precision and represent the accumulated coverage of one or more layers or groups of transformed vector paths.

With Spinel, both creation and application of soft masks are very efficient:

  • Creation of a soft mask from a hierarchy of layers and groups is much faster than filling the scene with color.
  • Applying a soft mask to a layer or group result is nearly free.

Note that any practical number of soft masks can be created and reused.

In the example below, two layers are covered in solid filled circles and have their colors dynamically changing on each frame. An enclosing soft mask is declared to create a transformable ellipsoid “porthole” that reveals the color-cycling circle layers.

In the video below, the porthole soft mask reacts to mouse input and is transformed with affine and perspective transforms:

(video removed)