Appearance
Template & Image Editor Overview
The Pictoflow Image Editor is an interactive, visual design studio powered by Fabric.js that allows you to construct dynamic image templates with pixel-level precision.
Editor Interface Overview
The editor layout consists of three primary working areas:
- Top Bar: Canvas name, dimensions settings, zoom controls, template saving, and quick export actions.
- Interactive Stage (Canvas): Visual stage with direct drag-and-drop, scaling handles, rotation pivots, and real-time rendering.
- Control & Layer Panels (Right Sidebar):
- Layer Panel: Manage layer order (z-index), visibility toggles, layer deletion, and selection.
- Properties Accordion: Contextual property tabs for General Properties, Transforms, Typography, and Shadows.
Canvas Controls & Keyboard Shortcuts
- Select Layer: Click directly on the layer on the canvas or select it from the Layer list.
- Move Layer: Click and drag on canvas, or adjust $X$ and $Y$ in the Transform panel.
- Delete Layer: Press Del or Backspace on your keyboard, or click the trash icon in the layer row.
- Layer Reordering: Drag layers up or down in the Layer Panel to control stack ordering (higher layers render on top).