Image Editor

Getting started

Open an image or start from a preset, place your first layer, and save the project as an .img file.

This page walks you from a blank tab to a saved project in five minutes.

#1. Launch the editor

Go to the studio home and pick Image Editor, or hit /tools/image-editor directly.

You land on the start screen with three choices:

Blank canvas — pick a preset (1080×1080 IG square, 1920×1080 HD, A4 print, etc.) or punch in custom dimensions.
Templates (growing library) — designed starters you can edit.
Open image — drop a JPG / PNG / WebP / SVG, or open a previously saved .img project.

Tip: dragging an .img file directly onto the start screen restores your full project — every layer, every effect, every history step.

#2. Move around the canvas

Action	Mouse / trackpad	Keys
Zoom	Wheel / pinch	`+` / `-`
Fit to screen	—	`0`
Pan	Middle-mouse drag	`Space` + drag, or `H` for hand mode
Switch to pointer	Right-click empty canvas	`V`

Right-click on empty canvas toggles between pointer and hand. That's the fastest way to flick between selecting and panning.

#3. Add a layer

Pick a tool from the left rail (or use its shortcut):

T — text, click the canvas to add a label
S — shape, drag to draw a rectangle / ellipse / triangle / star
B — brush, paint freely
I — icon stamp, pick from the Heroicons / Lucide library
A — asset stamp, drop an image you've uploaded into the assets panel
C — crop, drag a region and hit Apply to commit

When you create a layer, the right-side inspector panel shows everything you can change about it — color, font, stroke, gradient, effects.

Most tools support drag (size while creating) and click (stamp at default size). Hold Shift while dragging to constrain proportions; hold Alt to draw from the center.

#4. Arrange layers

Open the Layers panel (bottom of the editor). You can:

Re-order by drag.
Toggle visibility / lock.
Adjust per-layer opacity and blend mode.
Group with Ctrl+G, ungroup with Ctrl+Shift+G.
Clip-to-below with Ctrl+Alt+G (the layer is masked by whatever is beneath it).

See Layers and Groups for the full model.

#5. Save the project

Press Ctrl+S or use File → Save Project. The editor packages your work as an .img file — a ZIP with a manifest, the document JSON, and any image resources you've used.

Re-opening that file restores every layer, history snapshot, mask, and asset exactly. The format is versioned and migration-friendly — see The .img format.