Open the current full-screen v2 image editor from an Image Editor node or directly from an image-producing node, edit a native layered document, and persist a PNG preview/output back into Flowgen.
Where: Flowgen → Add → Image & Vector → Image Editor, or right-click one image-producing node → Image Editor
Key ideas
- Native document plus raster output: The authoritative node state is an ImageDocument containing layers and editor data. Rasterization/export produces the persisted PNG preview and downstream image result.
- Several honest entry points: Add Image Editor directly; right-click a single image-producing node to create and wire one; use Edit Canvas / thumbnail Edit on the card; or use Edit Composition / Open Canvas Editor from the selected-node sidebar.
- Current editor is v2: The node opens ImageEditorRoot as a fixed full-screen portal. The older LayerEditorModal is a ?v1=1 fallback and should not be treated as the normal UI.
- Card and sidebar responsibilities: The card owns the thumbnail, document size/background, rasterization state, editor buttons, and result; the properties sidebar exposes the same document/composition status and editor entry without duplicating the full editor.
- Image Editor card: LayerComposeNode uses the authored shared-card path. Edit a native layered ImageDocument and rasterize a persistent PNG result.
- Properties sidebar: editNodes.tsx
- Opened surfaces: Full-screen v2 ImageEditorRoot; image lightbox; dialogs/panels/AI overlays
- Precise non-destructive transforms: The Move options bar now exposes X, Y, W, H, angle, proportion lock, and horizontal/vertical flip; negative scale mirrors content inside a stable visible box.
- Promptable object selection: Object Select (J) now highlights on hover, commits on click, selects the union of objects in a dragged box, respects Replace/Add/Subtract/Intersect, and is the common refinement target for Select Subject and Remove Background.
- Current brush, mask, transform, and AI safety: The brush tip previews its real result; masks on adjustment layers limit the adjustment; flipped layers persist; Eraser and mask film mode behave consistently; Space pans; and Outpaint/Fill expose reliable size and context handling.
Steps
- Add Image Editor, or right-click one image result and choose Image Editor to create a prewired node.
- Open Edit Canvas/Open Image Editor and confirm the intended ImageDocument, canvas size, background, and source layers.
- Edit with the tool rail, menus, context-sensitive options, canvas, docked panels, dialogs, and AI workflows.
- Save/close so the changed document returns to the node; rasterize/export the PNG result when the graph or canvas needs a flat image.
- Preview the node output, then connect it downstream, add it to canvas, replace a selected image, or download it.
What opens
- Full-screen v2 ImageEditorRoot.
- Menu bar and context-sensitive options bar.
- Grouped tool rail and foreground/background colors.
- Layered canvas with zoom/pan/status.
- Flexible panel workspace.
- Dialogs/overlays for export, canvas background, resize, selections, color, styles, AI, and context menus.
Document layers
- Raster.
- Shape and editable vector path.
- Text.
- Group.
- Fill.
- Adjustment.
Image Editor controls and presets
- Add path: Flowgen → Add → Image & Vector → Image Editor.
- Card: LayerComposeNode.
- Properties: editNodes.tsx.
- Controls: Canvas size/background; document/layers; Edit Canvas; rasterize; history; result actions.
- Opened surfaces: Full-screen v2 ImageEditorRoot; image lightbox; dialogs/panels/AI overlays.
New transform and blur controls
- Drag a scale handle through its anchor to mirror.
- Flip Horizontal/Vertical from Move options or Edit → Transform.
- Type X/Y/W/H/angle values and commit with Enter or blur.
- Use Lens Blur Blades/Rotation for aperture bokeh.
- Use Repeat edge pixels to keep full-bleed blur edges solid.
Subject-selection surfaces
- Tool rail: Object Select (J).
- Options bar: Select Subject (canvas).
- Select menu: Select Subject and Select Subject (Layer).
- AI panel: Remove Background → Refine with Object Select.
- Normal pixel-selection destinations: masks, clear/copy/fill, AI edit, Refine Edge, saved channels.
Recent behavior fixes
- Adjustment-layer masks affect the adjustment, not only pixel layers.
- Horizontal/vertical flip survives document save/reload.
- Eraser removes from the intended layer/mask.
- Mask film mode provides a clear coverage overlay.
- Holding Space temporarily pans.
- Outpaint/Fill send the selected size and protected context so surrounding content is not silently replaced.
- Editing cards use faster real-time preview paths where supported.
Crop, smart objects, channels, and large-image fixes
The Image Editor now exposes ratio/straighten cropping with optional destructive pixel trimming, smart-object embedded-content operations, a layer filter bar, component-channel viewing, and a live histogram. The focused guides below describe the actual controls and boundaries.
- 4K brush strokes and masks persist more reliably; live changes to brush settings apply without restarting the tool.
- GPU-pressure handling protects mask/brush work, but browser memory and hardware still limit large documents.
- SVG/path vertex editing supports multi-selection, segment movement, and resynchronization after undo.
- Deep duplication keeps masks and nested effect data independent between copies.
Current menu and floating-surface behavior
Image Editor menus now use the shared styled select control and the full-screen workspace owns a top-level floating layer. Tooltips, dropdowns, filters, blend modes, channel/range controls, and dialogs stay above the editing surface instead of being clipped behind it.
- Crop ratios and AI actions
- Curves channels and Selective Color ranges
- Layer kind/visibility filters
- Blend modes, smart filters, and vector properties
- Panel registry, export, layer-style, and save-selection dialogs
Tips
- Keep the native ImageDocument when later edits matter; use the flat PNG as a delivery/downstream result.
- Name layers before a complex edit so history, masks, and AI output remain understandable.
Limitations and important notes
- The full editor is opened as a portal rather than embedded in the card.
- The v1 fallback is legacy and does not describe the normal current tool/panel surface.
Troubleshooting
Right-click does not show Image Editor
Select exactly one node whose current output is recognized as an image.
The downstream node still shows the old image
Save/close the editor, rasterize the updated document, and rerun the dependent node.
Related guides
- Open the Image Editor from the graph, card, or sidebar
- Image Editor tool rail: complete reference
- Image Editor layers, masks, adjustments, filters, and workspaces
- Use AI Fill, Erase, Restyle, outpainting, and Remove Background
- Save, export, rasterize, and reuse an Image Editor result
- Flip, size, position, rotate, and lens-blur layers in Image Editor
- Image Editor Object Select: hover, click, and multi-object boxes
- Select a subject or object across flowmo
- Image Editor: crop ratios, straighten, and canvas transforms
- Image Editor: smart objects, embedded contents, and layer filtering
- Image Editor: component channels and the live histogram