Skip to content

Stroke Style

When adding a Stroke Style to the Shapes container, several options will appear in the tree on the same line.

Picture

  • Visibility: completely disables the Style if turned off
  • Blending Mode: defines the mode for blending a Style with preceding Styles
  • Opacity: defines Style transparency
  • Stroke Color: represented by a pen, this parameter provides quick access to the same parameter in the Properties section
  • Modifier Slot: adds Modifiers to a Style

Stroke Color and Colorspace

These parameters define the color that will be used to draw the Stroke. It's important to know that each channel can only be set between 0.0 and 1.0. Any value above 1.0 or below 0.0 will be clamped.

To bring up the Color Selector, click on the colored dot to the right.

Note

To boost output channel values above 1.0, you can add a Modifier like Grade to the Style and increase the Multiply parameter.

The color is defined according to the Colorspace parameter, located a little further down. Read more about the Colorspace parameter in this section

Stroke Width

The Stroke Width value defines the Stroke Width in pixels for all Paths drawn, defined for a Scale of 1.0 in the Layer Tranform parameters.

The default behavior is that if the Scale parameter is set to 2.0, a Stroke Width of 15.0 will look like 15.0 x 2.0 = 30 pixels.

Scale Stroke Width

However, you can request that the Stroke Width remain constant regardless of the layer Scale value. Just below this parameter there is a Scale Stroke Width option that is enabled by default.

By unchecking this option, the Stroke Width will always have a visual value of the set value, 15.0 in the previous example.

Start, End, and Offset

Even with a closed Path, a curve always consists of a start point and an end point. These three parameters define whether the Stroke should be drawn on the entire Path or only on a segment.

  • Start: This is the starting point of the Stroke drawing; the 0.0 default value represents the Path start
  • End: This is the Stroke drawing end point; the 1.0 default value represents the Path end
  • Offset: This value is added to the Start and End parameters. It makes it easy to slide the drawn segment along the Path

Note

The Trim Path Modifier offers the same type of parameter behavior, allowing you to cut a Path into several pieces and create multiple Sub-paths.

Start/End Mode

When a Stroke Style draws several Paths, grouped together in a Path Group you can alter the following parameters to set it to draw them one after the other or at the same time when modifying the Start, End, and Offset parameters:

  • Join Paths: this parameter ensures the Start and End parameters are distributed over all aggregated paths:
    • 0.0 defines the start of the first Path
    • 1.0 defines the end of the last Path
  • Separate Paths: this normalizes values 0.0 and 1.0 on each Path independently
    • 0.0 defines the start of all Paths
    • 1.0 defines the end of all Paths

Start/End Cycling Mode

When a value is defined outside the [0.0 - 1.0] range, it's internally converted to a new value between these limits.

To understand this conversion, we can superimpose two lines representing the following:

  • Top: original values
  • Bottom: converted values

Picture

As shown, the bottom line is made up of a series of segments between 0.0 and 1.0.

By following this conversion rule:

  • A value of 1.2 will be converted to 0.2
  • A value is -0.3, will be converted to 0.7

This can lead to a situation where the Start value is greater than the End value.

The Start/End Cycling Mode parameter can be used to define the following:

  • Loop: always draws a Path from Start to End; results in a visual jump when the two values cross
  • Alternate: internally swaps the Start and End parameters when the Start is greater than the End; for a Start value of 0.0, continuously increasing the End value will draw then delete the segment seamlessly to redraw it at every multiple of 2.0

Note

The Reverse Points Order tool in the Path Editing tools reverses the definition of the Path points, reversing the Stroke's flow.

Separated Paths Options

Switching Start/End Cycling Mode to Separated Paths will bring up four additional parameters that allow you to time shift the animation of each drawn Path.

Warning

These parameters are only relevant when at least one of the Start, End, or Offset parameters is animated. This animation can be provided by keyframes, Generators, and Modifiers. The important thing is that at least one of its values evolves over time.

  • Time Offset: applies the same time offset to all Path drawings
  • Accumulate Time Offset: when this option is Enable, the Time Offset value is multiplied by the Path index, starting from 1.
    • The first Path drawn will undergo the Time Offset value x 1
    • The second Path drawn, Time Offset x 2
    • Etc.
  • Accumulate Distribution: this is only available when Accumulate Time Offset is enabled; defines how indexes are assigned to a Path
    • Forward: assigns indexes in Path order from top to bottom in the tree
    • Backward: does the same as above but moving up the tree from bottom to top
    • Shuffle: randomizes Path indexes
  • Shuffle Seed: modifies random index assignment in Shuffle mode according to the Seed value

Edge Draw Mode

Edge Draw Mode lets you offset the outline along the normal of the Path:

  • Center: draws the Stroke on the Path
  • Inside: draws the Stroke inside the Path
  • Outside: draws the Stroke outside the Path

Cap Style

Cap Style defines the shape of the outline ends:

  • Flat
  • Square
  • Round

Join Style

Join Style defines the shape of corners along the Path:

  • Miter: tries to keep sharp angles a point; use the Miter Limit parameter to control point size
  • Bevel: cuts the corner to apply a bevel shape
  • Round: rounds the corner

Miter Limit:

When points create a very obtuse angle, you'll notice that the corner gets cut off, and that the point of this angle gets truncated as it becomes more acute.

When increasing the Miter limit parameter value, the point can be reconstructed a little further. Increasing this value will make the drawing more and more precise, and will require more and more calculations when reconstructing these points.

Note

Don't hesitate to increase this value depending on the angles your shape produces.

Pen Style and Dash Pattern

Pen Style defines the drawing mode. Initially it is solid, but it can be switched to Dash to generate dotted lines.

  • Solid: this is the default mode; draws a continuous curve
  • Dash: generates dotted lines
  • Dot: draws dots that have an equal length and width; the number of dots and their spacing depends directly on the Stroke Width.
  • Dash-Dot: combines the two previous modes, Dash and Dot
  • Dash-Dot-Dash: draws a dash followed by two dots

  • Custom Pattern: for even more control, this mode will open a new section where you can define your own sequence of elements

    • Dash Length: the length of the dash which will define the distance between two dashes; Dash offset is also compatible with this mode
    • Space Length: the distance between two dashes

Note

This sequence can contain an unlimited number of patterns. New elements can be added to this list by clicking on the "+" button.

Dash Start Offset:

Dash Start Offset lets you move dotted lines along a path without having to modify the Start and End parameters. Dash Start Offset doesn't change the trim performed by these two parameters.

It is also compatible with Custom Pattern mode.


Options

In the Options section, you'll find parameters that are already accessible in the main Style line, in the Selection Overview:

  • Enabled: represented by the eye icon
  • Blending Modes: accessible via the button next to the eye icon
  • Opacity: adjustable via the slider immediately to the right

What's different here is that when accessed in this section, these parameters can be animated, connected to Generators, and have Modifiers added to them.

Affected Path specifies how many Paths will be drawn:

  • First Path-Group Above: draws all Paths that can be found going up the tree until another Style is found
  • All Paths Above: draws all existing Paths to the top of the tree, stopping only at the top of the current Shape Group

Produce Overbright and Negative Values with Blending Modes

We have already mentioned that channel values for the Stroke Color parameter cannot exceed 1.0. However, if two styles are in the same Shapes Generator and the latter is in Add mode, channels will be added, and the result of this Blending may exceed the value 1.0. The same applies to modes that can produce negative values.

Motion Blur:

Each Style contains a Motion Blur section for calculating Motion Blur individually, according to different parameters.

The way it is computed is similar to the Steps method in the Text Generator.

This method renders several intermediate images between two composition images, defined by the Divisions parameter:

With few divisions, this accumulation produces a kind of echo. The intermediate stages are clearly visible. Increasing these divisions will produce a more accurate Motion Blur effect.

Other parameters, such as Shutter Angle and Shutter Phase are identical to layer Motion Blur described in this section.