---
title: "Fills, strokes, effects and masks"
description: "Change how layers are painted, blurred, blended and revealed."
canonical: "https://terminal.lottiefiles.com/docs/layers/appearance/"
last_updated: 2026-10-29
---

# Fills, strokes, effects and masks

Change how layers are painted, blurred, blended and revealed.

[All layer types](https://terminal.lottiefiles.com/docs/layers.md) · [Editing on the stage](https://terminal.lottiefiles.com/docs/editing.md)

## Fills and strokes

A shape layer's **Appearance** in the rail (the Properties panel in After Effects or Figma) lists its fills and strokes, the top one first.

- **+ fill** and **+ stroke** add one to every shape layer selected.
- Each row has its swatch (the colour picker), hex, opacity and a stroke's width. ◉ hides it,
  ✕ takes it off. Its ▸ opens Opacity and Width as rows that key, and a stroke's dashes.
- A layer made of several groups (as After Effects exports and Figma pastes are) gets a new paint
  under its parts' own, so a stroke shows round each part.

### Gradients

A swatch opens the colour picker with **Solid**, **Linear**, **Radial** and **Conic**.

- Switch a solid colour to a gradient (its colour becomes the first stop), and back.
- A conic gradient turns its stops once around its start, clockwise from the direction of its
  end. Lottie has no conic gradient, so other players draw a radial one from the same middle;
  Creator Terminal opens it as conic again. Figma's angular gradients paste in as conic.
- The stops are in a bar: click the bar to add one, drag one along it, click one to colour it,
  `⌫` takes it off (two stay).
- While the picker is open, the stage shows the gradient's line, its stops and a radial one's
  highlight, to drag.
- The ▸ has **Start**, **End**, and a radial one's **Highlight** and **Angle**. The stops key at the
  playhead together.
- The palette's **Linear gradient fill**, **Radial gradient fill**, **Conic gradient fill** and **Solid
  fill** (and the same for strokes) switch every layer selected.

### Trim paths and dashes

A stroked layer has **Trim paths** in the rail, and each stroke **Dashes** under its ▸.

- Trim paths: **Start** and **End** are the part of the stroke drawn (0 to 100 %), **Offset**
  turns it round. **draw on** keys End from 0 to 100 % over the layer's time (or the loop). With
  several shapes, trim them **simultaneously** or **individually** (one after another).
- Dashes: **Dash** and **Gap**, moved along by **Offset**.

Fills, strokes, linear and radial gradients, trims and dashes travel with the Lottie.
Conic gradients use the radial version in other players.

## Variable strokes

Select a stroked path and press `⇧V` (or the rail's **vary it**), or draw it with the brush.
Its width then varies along it:

| row | what it sets |
| --- | --- |
| **Width** | the stroke's full width (px) |
| **Ends** | its width at each end, as a share of Width (0 %: a point) |
| **Taper** | how far in from each end it widens to Width |
| **Wave** | how deep a wave in the width is, and how many run along it |
| **Phase** | where the waves are (animate it and they travel) |
| **Draw** | how much of it shows: 0 to 100 % draws it on |
| **Angle** | the nib's angle, for the brush |
| **Roundness** | how round the nib is: 100 % is even every way |

Each row keys like any other. Double-click the stroke to edit its path. It plays the same in every
player, and opening the file again brings back the rows. The **Variable Stroke** example shows
each row in turn.

## Motion blur

Select layers and press `⇧B` (or the rail's **Blur**). A blurred layer is drawn as a camera sees it
moving: smeared along its move. Sliding, turning, scaling and a path changing shape all blur.

- With nothing selected, the rail sets the shutter: how long it's open (180°, half a frame, as in
  After Effects), from when, and how many samples a frame takes at most.
- The stage, video and pictures draw the true blur.
- Lottie players don't draw motion blur, so Lottie, .lottie and SVG exports turn it into Gaussian
  blurs. A slide comes out close; a turn or a change of size doesn't blur there, and the export
  says so. `creator-tui export --no-blur-bake` leaves it out. An export opened again has those
  blurs, not the setting: the document (`.ctd`) keeps it.
- A Lottie from After Effects opens without its motion blur (players don't draw it): select
  the layers and press `⇧B`.

## Effects

The rail's **Effects** row adds, to the selected layers:

- **+ blur**: a Gaussian blur, for a focus pull, depth, a word blurring in;
- **+ shadow**: a drop shadow;
- **+ glow**: a soft halo in the layer's colour.

Their values are rows that key, and ✕ takes one off. Every dotLottie player draws them, and the
SVG export keeps them. On a shape or text layer the row also has **+ material** (see
[Materials](https://terminal.lottiefiles.com/docs/layers/materials.md#materials)).

To throw copies of a layer out over time (confetti, sparkles, snow, smoke), make it the particle
of an emitter: see [Particles](https://terminal.lottiefiles.com/docs/particles.md).

## Mattes, masks and blend modes

- **Matte**: the rail's **Matte** row shows the layer only through another (the one above, unless
  you choose one), by its alpha or luma, either inverted. Click the matte's name, or the
  palette's **Matte layer…**, to choose. One matte can serve several layers.
- **Masks**: select a layer and press `⌃M` (or **Draw as mask**). The rectangle, ellipse and pens
  then draw masks on it until `⌃M` again. Each mask is a row in the rail's **Masks**: its path keys,
  its name edits its points, `◂ ▸` steps its mode (add, subtract, intersect, lighten, darken,
  difference, none), its opacity and expansion key, **inv** inverts it.
- **Blend**: the rail's **Blend** row (or **Blend mode…**) sets how the layer's colours mix with
  what's under them: multiply, screen, overlay and the rest.

Players draw all three. An SVG export leaves out a mask's expansion and difference, and hard mix,
and says so.

## Effect controls

Click **↓ more** or scroll over the rail if an effect's rows are below the panel. Click **✕**
beside an effect to remove it.

| Effect | Rows |
| --- | --- |
| **Gaussian blur** | **Blurriness** in pixels |
| **Drop shadow** | **Colour**, **Opacity** (0–100%), **Angle** in degrees clockwise from up, **Distance** and **Softness** in pixels |
| **Glow** | **Colour**, **Opacity** (0–100%), **Softness** in pixels |

With nothing selected, the artboard's **Shutter** sets exposure in degrees of a frame,
**Phase** sets when it starts, and **Samples** sets the most samples per frame.
**Shutter** accepts 0–720° (default 180°), **Phase** −360–360° (default −90°), and
**Samples** 2–256 (default 128).

## Variable stroke ranges

**Ends** runs from 0–1,000% of **Width**, **Taper** from 0–100% of the path length at each
end. **Wave** pairs a depth (0–100%) with a count (0–64). **Draw** has a start and an end,
both 0–100%. **Roundness** runs from 1–100%.

## Matte choices

| Mode | What shows |
| --- | --- |
| **alpha** | Where the source is opaque |
| **alpha inverted** | Where the source is transparent |
| **luma** | Where the source is bright |
| **luma inverted** | Where the source is dark |

Choose **No matte** in the source list to remove the matte. A matte source must be in the
same composition and cannot have a matte or masks of its own.

![The Matte row set to alpha with Window as its source](https://terminal.lottiefiles.com/docs/assets/shots/draw-matte-source.png)

## Mask controls

| Control | Use |
| --- | --- |
| Marker before the name | Add or remove a path key at the playhead |
| Mask name | Edit its points on the stage |
| **◂** / **▸** | Cycle **add**, **subtract**, **intersect**, **lighten**, **darken**, **difference**, **none** |
| Opacity | Set 0–100%; click its marker to key it |
| Expansion | Push the edge out in pixels; negative values pull it in; it can key |
| **inv** | Reverse the area revealed |
| **✕** | Remove the mask |

**none** keeps the mask path but turns off its effect on visibility. If `⌃M` arrives as
`enter` in your terminal, choose **Draw as mask** in the palette or click **draw as mask**
in the rail.

![A circle revealed through a rectangular mask](https://terminal.lottiefiles.com/docs/assets/shots/draw-mask-window.png)

Try [cropping a layer with a mask](https://terminal.lottiefiles.com/docs/how-to/crop-a-layer-with-a-mask.md).
Watch: [Masks and mattes](https://terminal.lottiefiles.com/masks-mattes/).

## Blend choices

**Blend mode…** offers **normal**, **multiply**, **screen**, **overlay**, **darken**,
**lighten**, **color dodge**, **color burn**, **hard light**, **soft light**, **difference**,
**exclusion**, **hue**, **saturation**, **color**, **luminosity** and **add**.
These names retain the spelling shown in the app. A file's **hard mix** is shown in the rail,
but draws as **normal** here and is not offered to add.

## Paint commands in the palette

Press `:` and search for **Add a fill**, **Add a stroke**, **Linear gradient fill**,
**Radial gradient fill**, **Conic gradient fill** or **Solid fill**. The four kinds also have
stroke commands. **Dash the stroke** adds dashes; **Take the dashes off** removes them.
**Draw the stroke on** keys the trim. **Trim paths: one shape after another, or all at once**
switches its order; **Take the trim paths off** removes it.

Try [making a line draw itself](https://terminal.lottiefiles.com/docs/how-to/make-a-line-draw-itself.md).
Watch: [Strokes that draw on](https://terminal.lottiefiles.com/strokes-draw-on/).