sOutline Node

sOutline completes the Shape system with a key feature: adding an outer outline to an already styled shape, without changing its inner fill. Different from the Border Width built into sRectangle/sEllipse/etc., which only handles the shape's own stroke.

Useful as soon as you work with compound shapes (sMerge, sBoolean): the native Border Width of each source shape does not give a unified outline on the whole. sOutline does.

• Effects Library: Tools > Shape > sOutline
• Quick add: right-click in the Node Editor → Add Tool > Shape > sOutline

Native Border Width (sRectangle, sEllipse...)

Handles the outline of the individual shape. Fine for a simple shape. On a compound (sMerge + sBoolean), each shape gets its own outline = not unified.

sOutline

Adds an outline around the overall compound shape. A single consistent outline, independent of the inner shapes.

Rule: a simple shape → the built-in Border Width is enough. A compound shape (several merged/boolean shapes) → sOutline is required for a clean outline.

• Input1 (required) - the output of a shape node. Usually a compound shape coming from an sMerge or sBoolean.

Unified outline on a compound shape:
sRectangle → sBoolean Subtract ← sEllipse
                  ↓
              sOutline (Thickness 0.005) → sRender

Double stroke (two stacked outlines):
Shape → sOutline (Thickness 0.005, color 1)
      → sOutline (Thickness 0.01, color 2)  ← thick one underneath
      → sRender

Write-on animation:
Shape → sOutline (Length animated 0 → 1) → sRender

Shape with an outline color different from the fill:
sNGon (blue fill) → sOutline (Thickness 0.003, white color) → sRender

Thickness

Outline thickness. In normalized coordinates. 0.005 = a thin, subtle outline, 0.02+ = a thick outline in a flat illustration style.

Border Style

How the corners behave: Bevel (flat bevel), Round (rounded corners), Miter (extended sharp corners).

Cap Style

Ends of the outline (when Length < 1 and the outline is open):

• Flat: cleanly cut ends.
• Rounded: rounded ends (half circle).
• Squared: ends extended as a square.

Length

Fraction of the outline that is drawn. 1 = all of it, 0 = nothing, 0.5 = half. Animate 0 → 1 = a write-on animation of the outline.

Position

Starting point of the stroke along the outline. Combined with Length, it lets you place the gap in the outline.

• A unified outline around a compound shape - an sBoolean donut → sOutline = a clean outline around and inside the donut, impossible with the native Border Width.
• Double stroke (outline + outline) - two stacked sOutline nodes with different Thickness values and colors = a badge / crest effect with a double edge.
• Write-on animation of the whole outline - Length animated 0 → 1 = an outline that draws itself progressively. A classic graphic reveal.
• An outline color different from the fill - a shape with a blue fill, a white sOutline on top = blue ringed with white. An illustration / sports logo style.
• Outer outline for stickers / badges - a shape + an sOutline in a strongly contrasting color = a die-cut sticker look (like Instagram / social badges).
• Outlining text (with sBoolean + shapes) - letters built from shapes + sMerge + sOutline = text with a unified outline.
• Line logos with a controlled thickness - sOutline gives a consistent stroke independent of the properties of the source shapes.

• Thickness 0.003-0.008 = subtle, 0.01-0.02 = obvious, 0.03+ = very bold (cartoon / illustration style).
• Border Style Round for a friendly look (soft UI, Material design), Miter for a precise technical look (blueprint, geometric logo).
• Length animated 0 → 1 = write-on - for an "outline drawing itself" effect, animate Length over 1-2 seconds with ease-in/ ease-out.
• Stack sOutline nodes for double strokes - a first thick dark sOutline, a second thinner light one = a relief / embossed effect.
• Cap Style Round for an elegant write-on - the rounded ends of the stroke move more cleanly than Flat ends.
• sOutline after sTransform - if you put the sTransform before the sOutline, the outline is transformed too. If you put it after, the outline keeps the same thickness whatever the scale of the shape.
• For a variable stroke (a thickness that changes along the path), sOutline is not enough. Combine several sOutline nodes or import an SVG with a variable stroke.