Skip to main content

​
Selecting a Layer

Before you can edit a layer, you need to select it. There are two ways to select a layer:
  1. From the Layers panel (left side): Click on the layer name in the list
  2. From the Canvas (center): Click directly on the layer in the preview
When a layer is selected, you’ll see:
  • A green highlight on the layer in the layer panel
  • Selection handles around the layer in the Canvas
  • The layer’s properties displayed in the Inspector panel (right side)

​
Editing from the Inspector

The Inspector panel on the right side shows all editable properties for the selected layer. The Inspector is organized into tabs: General Tabs (on most layers):
  • Geometry: Basic layer properties (position, bounds, rotation, anchor point, etc.)
  • Compositing: Opacity, corner radius, clip contents
  • Content: Background color, background opacity, border color, border width
  • Animations: Keyframe animation settings
  • Gyro: Configure device tilt effects (Transform Layers only)
  • Filters: Non-destructive effects like Blur, Contrast, and Hue Rotate
Each tab is specific to the layer type. For example, Image layers have an Image tab with specialized tools like Crop and Blur, while Emitter layers have an Emitter tab for configuring particles.
Common Properties:
  • Position (X, Y): Layer location on the canvas
  • Bounds (W, H): Layer dimensions
  • Rotation (X, Y, Z): Layer rotation in degrees
  • Opacity: Layer transparency
  • Corner Radius: Rounded corners
  • Background Color: Layer background fill
  • Border: Border color and width

​
Editing Properties

To edit a property value:
  1. Find the property you want to change in the Inspector
  2. Type the new value or use the arrow keys to increment/decrement if it is an input. Some properties have sliders or other input methods.
  3. Press Enter or click outside the field to apply the change.
Common property types:
  • Number inputs - Type a number or use arrow keys (e.g., Position X, Position Y)
  • Dropdowns - Click to open a menu and select an option (e.g., Key path for animations)
  • Toggles/Switches - Click to turn features on or off (e.g., Enable animation)
  • Color pickers - Click to open a color selector (for background color of a layer)

​
Editing from the Canvas

The Canvas provides visual, interactive editing for certain properties:

​
Moving Layers

To reposition a layer:
  1. Click and hold on the layer in the Canvas
  2. Drag it to the desired position
  3. Release to apply the new position
The Position X and Position Y values in the Inspector will update automatically as you drag.

​
Resizing Layers

To resize a layer:
  1. Select the layer to show selection handles (small squares at the corners and edges)
  2. Click and drag a corner handle to resize proportionally
  3. Click and drag an edge handle to resize in one direction
  4. Release to apply the new size
The Bounds Width and Bounds Height values in the Inspector will update automatically.
Hold Shift while dragging a corner handle to maintain the layer’s aspect ratio. Hold Alt (Windows) or Option (Mac) to resize from the centre.

​
Rotating Layers

To rotate a layer:
  1. Select the layer
  2. Look for the rotation handle (a circle above the top middle handle if the layer has not been rotated yet)
  3. Click and drag the rotation handle to rotate the layer
  4. Release to apply the rotation
The Rotation value in the Inspector will update automatically.

​
Visual Feedback

While interacting with layers on the canvas, you will see real-time feedback:
  • Guides: Purple lines appear when you are aligned with the center of the canvas or with other layers.
  • Tooltips: Small labels appear near your cursor showing the exact Width, Height, or Position as you move and resize.
  • Snapping: Your layer will “stick” to key points (like edges) to help with accuracy.

​
Tips

  • Undo/Redo: Use Cmd+Z (Mac) or Ctrl+Z (Windows) to undo changes, and Cmd+Shift+Z / Ctrl+Shift+Z to redo
  • Precision editing: Use the Inspector for precise numeric values
  • Visual editing: Use the Canvas for visual adjustments