2D Canvas Editor (Pixi): Layers, Drawing & Vector Tools
The Pixi 2D editor opens when you double-click an image node on the infinite canvas. It gives you a Photoshop-style layer stack, raster painting, and a full vector pen/shape toolkit. Tools live in the floating round toolbar at the bottom; the Layers panel is on the right.
Opening & saving
To edit an image: double-click its node on the canvas. Your changes save automatically as you work. To export a flat copy as a new node, click the Save as new image (disk) icon in the toolbar, or press Ctrl/Cmd+S.
To reset the view (re-fit and re-center), click the Reset View icon or press 0.
Layers panel
The Layers panel (right side) lists every layer top-to-bottom. The header has three buttons: New group (folder+), Duplicate layer (copy), and Add layer (+). Click a row to make it the active layer.
Per row you get:
- Visibility — click the eye icon (left of each row) to show/hide.
- Lock — click the lock icon to freeze a layer (locked layers can't be edited, moved, or dragged). Locking a folder locks its whole subtree; children show an inherited lock you can only release at the folder.
- Delete — click the trash icon, or press Delete/Backspace with the layer active.
- Rename — double-click the layer name.
- Reorder — drag rows to restack. Drag a layer onto a folder row to drop it inside.
Select the active layer below in the panel and use Opacity and Blend Mode (Normal, Multiply, Screen, Overlay) controls at the bottom. Groups expose Group Opacity and a blend mode of Pass Through / Multiply / Screen / Overlay.
Multi-select layers with Ctrl/Cmd+click (toggle) or Shift+click (range). Ctrl/Cmd+click a layer thumbnail loads a pixel selection from that layer's non-transparent content.
Layer right-click menu
Right-click a layer for: Duplicate Layer, Save as PNG, Vectorize Sketch…, Group Layers (when 2+ selected), Ungroup / Select Children (on groups), Merge Down (Ctrl+E), Merge Layers (Ctrl+E, when 2+ selected), and Delete Layer / Delete Group & Contents.
Raster vs vector layers
Two layer kinds coexist in the same stack:
- Raster layers hold pixels — painted with Brush/Eraser/Bucket, or generated images.
- Vector (path) layers hold editable Bézier paths — created by the Pen, Pencil, Shape, and Vectorize Sketch tools, and re-editable any time with the pen sub-tools.
Merging only works within one kind: raster+raster rasterizes into pixels; path+path combines into one editable path layer.
Brush & Eraser (B / E)
To paint: select Brush (B) and drag on a raster layer. Eraser (E) removes pixels the same way. Set the paint color with the color swatch in the toolbar.
Brush settings: right-click the Brush or Eraser toolbar button. The popover has:
- Size, Opacity, Hardness
- Tip Shape — Roundness, Angle, Grain
- Dynamics — Flow, Spacing, Scatter, Size Jitter, Rot. Jitter
- Pressure affects (pen tablets): Size, Opacity, Both, or Off
Brush presets: when Brush or Eraser is active, a preset strip appears under the toolbar — click a preset to apply it. You can also save the current brush as a custom preset from the settings popover.
While painting, press [ / ] to shrink/grow brush size, or hold Ctrl/Cmd+Alt and drag (horizontal = size, vertical = hardness).
Bucket Fill (G)
To flood-fill: select Paint Bucket (G) and click. It fills with the current brush color.
Pen & Pencil (P)
The Pen is a split button: the main icon draws, the chevron picks Pen (P) or Pencil (N).
- Pen (P) — click to place anchor points; drag to pull Bézier handles. Each path becomes its own vector layer.
- Pencil (N) — drag a freehand line; on release it's fitted to a clean editable path. Its options panel (top-left) has Stabilize (live input smoothing) and Pencil Smooth (finished-line fit).
When a vector tool is active, a second sub-bar appears with the pen sub-tools and the Shape/Corner tools.
Pen sub-tools (vector sub-bar)
- Move / Direct Select (V) — select and move anchors and handles. This is the base edit mode; clicking an active sub-tool returns here.
- Add Anchor (+) — add an anchor point to a path.
- Delete Anchor (−) — remove an anchor point.
- Scissors (C) — cut a path into separate sub-paths.
- Bend — bow a straight segment into a curve.
Shape tool (U)
To draw a primitive: open the Shapes split button in the vector sub-bar (U), pick Rectangle, Line, Ellipse, or Polygon from its chevron menu, then drag on the canvas. For Polygon, set the side count with the −/+ stepper in the dropdown. Shapes are vector paths.
Corner tool (fillet radius)
To round corners: pick the Corner tool in the vector sub-bar. Its top-left panel has two modes:
- All — the Radius slider live-rounds every corner on the selected path layer(s). Select more layers to round them together.
- Individual — drag each corner's widget on the canvas.
Vector path styling
With a path layer selected (Pen, Shape, or Direct Select V), the top-left options panel exposes styling. Writes apply live to the path:
- Stroke — toggle + color + Width.
- Fill — toggle + color.
- Taper — thin the stroke toward the ends, with an Amount slider.
- Parallel — fan offset copies of the stroke: Distance, Count (interpolated lines), and Offset X/Y.
- Sketch — a hand-drawn look with presets (Clean / Sketchy / Pencil / Rough) and a Settings disclosure (Roughness, Wobble, Passes, Grain).
- Texture — procedural stroke grain: Pencil / Charcoal / Chalk, with Scale and Strength.
Flatten (Pen panel) bakes parallel copies and rounded corners into plain editable paths.
Selection tool & marquee
- Select (V) — the default arrow: click layers, move and free-transform their content.
- Lasso (L) — a split button; the chevron picks Polygonal Lasso, Freehand Lasso, Rectangular Marquee, or Elliptical Marquee to make a pixel selection.
Selection shortcuts: Ctrl/Cmd+A select all, Ctrl/Cmd+D deselect, Ctrl/Cmd+I invert. With a selection active, Ctrl/Cmd+J = layer via copy, Ctrl/Cmd+Shift+J = layer via cut (without a selection, Ctrl/Cmd+J duplicates the layer).
Segment tool (S) — AI object selection
To select an object by clicking it: pick Segment (S) and click on the subject; the AI returns a mask you can turn into a new content layer or a mask layer. Useful for isolating a subject before further editing.
Path Warp (W) — puppet warp
To bend an image along a path: pick Path Warp (W). In the top-left panel, Pick one or more paths and one target Layer (click on the canvas or in the Layers panel), then Morph. While warping, drag the path's anchors and handles to deform the image; the Influence slider sizes the warp's reach. Apply (Enter) bakes it into the layer; Esc steps back. Undo (Ctrl+Z) reverts one morph step within the live session.
Tip: draw a guide path with the Pen (P) first, then warp the image along it.
Vectorize Sketch
To trace a raster sketch into editable vectors: right-click the layer → Vectorize Sketch…. The dialog previews live as you tune the knobs and commits the result as a native path layer placed over the source. Modes:
- Centerline — one stroked path per clean sketch line.
- Ridge — centerlines from shaded, tonal, or faint art.
- Outline — closed loops around the ink boundary.
The result is a normal path layer, so you can restyle and re-edit it with the pen sub-tools. See Sketch pipelines & prompt tools for the full Vectorize dialog.
Merge, group & transform
- Merge Down — Ctrl/Cmd+E (active layer onto the one below), or the right-click menu.
- Merge Layers — select 2+ same-kind layers, then Ctrl/Cmd+E or the right-click menu.
- Group — Ctrl/Cmd+G (selected layers into a folder). Ungroup — Ctrl/Cmd+Shift+G.
- Free Transform — press T to scale/rotate/move the active layer's content.
History
Undo — Ctrl/Cmd+Z. Redo — Ctrl/Cmd+Shift+Z. Drags, slider sweeps, and arrow-key nudges each collapse into a single undo step.
Keyboard shortcuts
| Key | Tool / action |
|---|---|
| V | Select / Direct Select (move anchors) |
| L | Lasso (marquee modes via chevron) |
| S | Segment (AI object selection) |
| B | Brush |
| E | Eraser |
| G | Paint Bucket |
| P | Pen |
| N | Pencil |
| C | Scissors (pen sub-tool) |
| + / − | Add / Delete anchor (pen sub-tool) |
| U | Shapes |
| W | Path Warp |
| Z | Zoom |
| T | Free Transform |
| 0 | Reset view |
| [ / ] | Brush size down / up |
| Ctrl/Cmd+Z | Undo |
| Ctrl/Cmd+Shift+Z | Redo |
| Ctrl/Cmd+S | Save as new image |
| Ctrl/Cmd+E | Merge down / merge selected |
| Ctrl/Cmd+G / +Shift+G | Group / Ungroup |
| Ctrl/Cmd+A / D / I | Select all / Deselect / Invert |
| Ctrl/Cmd+J / +Shift+J | Layer via copy / cut |
| Delete / Backspace | Delete active layer |