---
title: "Shapes and drawing tools"
description: "Draw shapes, paths and brush strokes, and change their parameters."
canonical: "https://terminal.lottiefiles.com/docs/layers/drawing/"
last_updated: 2026-10-29
---

# Shapes and drawing tools

Draw shapes, paths and brush strokes, and change their parameters.

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

## Making a layer

The left panel, under **CREATE**, lists what you can add, each with its key. `v` or `esc`
goes back to selecting. **More shapes ›** lists the rest of the shapes, each with its key too;
**Particles** makes an emitter at once (of the selected layer, if there is one: see
[Particles](https://terminal.lottiefiles.com/docs/particles.md)).

| key | adds |
|---|---|
| `⇧R` `⇧O` | a rectangle, an ellipse |
| `⇧D` `⇧S` | a polygon, a star |
| `⇧Q` `⇧I` `⇧C` `⇧W` `⇧E` `⇧G` `⇧F` | under More shapes: an arc (a pie or a loader), a ring, a capsule, an arrow, a squircle, a cogwheel, a supershape |
| `⇧P` | the pen (again: the curve pen) |
| `⇧N` | the pencil (again: the brush) |
| `⇧T` | text |
| `⇧X` | a chart |
| `⇧Z` | a material |

To draw a rectangle or an ellipse, drag on the stage:

- the bottom line reads out its size;
- `⇧` (or ctrl) makes it square, `⌥` draws it from the centre;
- a click without a drag drops one of a set size.

Pressing alone shows no shape; it appears when you start dragging, or when you release a click.

Letting go adds a shape layer on top, named and numbered ("Ellipse 2"), there for the whole score,
selected. It's one undo step.

To animate it, key a value at the playhead (`p` position, `s` scale, `r` rotation, `t` opacity,
`A` anchor, `f` fill), move the playhead and change it. `w` saves.

On a narrow terminal the panel shows icons only. In Creator documents, adding layers waits for
value sync.

## Shapes

Drag a shape in a box, or end to end for a capsule or an arrow. Selected, it shows handles of its
own:

- a ring moves one of its points;
- a diamond changes a value (a radius, a width, how square);
- a square changes a count (sides, teeth).

Its **Sides**, **Radii**, **Angles** or **Teeth** are rows in the rail (the Properties panel in After Effects or Figma) that key and ease like any other.
Every shape plays the same in any Lottie player, and stays editable when the file opens again.
Editing a shape's points makes it a plain path.

## Shape parameters

The rail (the Properties panel in After Effects or Figma) shows these rows. Drag a number,
or click it to type; click its key marker to animate it.

| Shape | Rows and values |
| --- | --- |
| **Rectangle**, **Ellipse** | **Size**: width and height in pixels |
| **Polygon** | **Sides**: 3–1,000; **Radius** in pixels |
| **Star** | **Points**: 3–1,000; **Radii**: outer and inner in pixels |
| **Arc** | **Radii**: outer and inner; **Angles**: start and end in degrees |
| **Ring** | **Radii**: outer and inner in pixels |
| **Rectangle** with separate corners | **Size**, **Top radii**, **Bottom radii**, **Chamfer**: 0 for rounded corners, 1 for straight cuts |
| **Capsule** | **Length**; **Ends**: the two end radii, in pixels |
| **Arrow** | **Length**, **Width**; **Head** and **Tail**: length and width, in pixels |
| **Squircle** | **Size**: width and height; **Curve**: 1–40, larger values make squarer edges |
| **Cogwheel** | **Teeth**: 3–120; **Radii**: outer radius and hole; **Tooth**: depth in pixels and width in percent (1–99); **Taper** in degrees |
| **Supershape** | **Radius**; **Lobes**: 0–64; **Bulge** and **Edges**: 0.05–40, shaping the curve |

Counts such as **Sides**, **Points** and **Teeth** use whole numbers and hold until the next
key. Other parameters can ease between keys. **Top radii** reads left then right;
**Bottom radii** reads right then left. Radii that cannot fit along an edge shrink together.

![A rounded coral rectangle with its corner dots visible](https://terminal.lottiefiles.com/docs/assets/shots/draw-rounded-card.png)

Try [drawing a rounded card](https://terminal.lottiefiles.com/docs/how-to/draw-a-rounded-card.md).
Watch: [Draw your first shapes](https://terminal.lottiefiles.com/first-shapes/).

## Corners

A selected rectangle, polygon, star, arrow or path shows dots inside its corners.

- Drag one in to round every corner. The radius is the rail's **Corners**, which keys.
- `⌥`-drag a rectangle's dot to round that corner alone. The rectangle then has **Top radii**,
  **Bottom radii** and **Chamfer** rows.

## The pen and the pencil

### Pen

`⇧P` draws a path: click for sharp points, drag for smooth ones, click the first point to close
it. `enter` or `esc` finishes; `⌫` takes the last point back; `⇧` keeps a line to 45° steps.

`⇧P` again is the **curve pen**: click points and the curve flows smoothly through them. `⌥`-click
for a corner; click a point you just put to switch it between corner and smooth.

Either pen snaps to the selected layer's points and lines: start on one to branch off, end on one
to join. An end that meets another end makes them one path.

### Pencil

`⇧N` draws freehand: drag, and letting go turns the stroke into a few smooth curves.

- **Smoothing**, from off to max, makes the line trail the pointer. Off follows the pointer
  exactly; higher settings smooth out hand tremor.
- For strokes that taper at their ends, draw with the brush: its nib makes them thick and thin.
- `⇧` draws a straight piece at 45° steps, `⌥` at any angle. End where you started to close it.
- **Hold still** at the end of a stroke and it becomes the shape you meant: a line, an arc, a
  circle, an ellipse, a triangle, a rectangle, a polygon. Let go to keep it.
- Start at an end of the selected open stroke to carry on from there.
- Each stroke is a layer and one undo step. `esc` while drawing drops the stroke; `esc` again puts
  the pencil down.

### Brush

`⇧N` again (or the rail's **Draw with**) draws thick and thin with a calligraphic nib.
The rail sets its **Size**, **Angle** and **Roundness**. Each stroke
is a [variable stroke](https://terminal.lottiefiles.com/docs/layers/appearance.md#variable-strokes).

With **Draw on** set to **as drawn** (the default), each stroke draws itself on at the pace you drew
it, and the playhead moves to its end, so the next stroke follows. Write a word stroke by stroke
and it animates as written.

Draw on's **trim** makes the strokes one drawing, with a **Start** and an **End** shared by length in the
order drawn: End from 0 to 100 % draws them all on, one after another. **off**: strokes are
there.

## Drawing controls

| Control | Choices or value |
| --- | --- |
| **Draw with** | **pencil** or **brush** |
| **Smoothing** | The dots from **off** to **max**; more smoothing rounds curves and reduces points |
| **Width** | Pencil widths: 1, 2, 4, 8 or 16 pixels |
| **Size** | Brush sizes: 8, 16, 24, 40 or 64 pixels |
| **Angle** | Brush angles: 0°, 30°, 45°, 60° or 90° |
| **Roundness** | Brush nibs: 10%, 25%, 50% or 100%; 100% makes it round |
| **Draw on** | **as drawn**, **trim**, **off** |

For point selection, handles, joins and the paint bucket, see [Editing paths](https://terminal.lottiefiles.com/docs/editing.md#editing-paths).