A full WYSIWYG artboard editor with layers, properties panel, drag-to-position, and multi-format support — purpose-built for HTML5 banner production.
Build banners by stacking layers — text, images, buttons, rectangles, and background elements. Each layer has its own position, size, rotation, opacity, and animation properties. Reorder layers by drag-and-drop in the sidebar, lock layers to prevent accidental edits, and toggle visibility to focus on specific elements. The layer system mirrors what designers expect from tools like Figma or Photoshop, but outputs production-ready HTML5.
Define multiple ad sizes in a single project — 300x250, 728x90, 160x600, 320x50, and any custom dimensions. Each format gets its own artboard with independent layer positioning, so you can fine-tune layouts per size while keeping shared assets and animations consistent. Add new formats at any time, and optionally use AI auto-resize to adapt layouts intelligently.
Select any layer to reveal a context-sensitive properties panel on the right. Text layers show font family, size, weight, colour, line height, and letter spacing. Images show source URL, object fit, and border radius. All layers expose position (x, y), dimensions (width, height), rotation, opacity, and animation controls. Changes apply instantly on the artboard with no render delay.
Full keyboard shortcut support for professional workflows — arrow keys for pixel nudging, Shift+arrow for 10px jumps, Delete to remove layers, Cmd+D to duplicate, Cmd+Z/Shift+Cmd+Z for undo/redo, and bracket keys for layer reordering. Shortcuts are discoverable in the editor and match conventions from popular design tools so there is no learning curve.