Legon Editor Overview

Every design tool has an engine underneath it, but most of the time you never think about it — you just click things and hope the state stays consistent. Lega's engine is called Legon, and it's worth knowing a little about how it works, because a few of its properties directly explain things you'll notice while editing: why undo never leaves you in a weird half-state, why AI generations don't corrupt your existing layout, and why the canvas feels the same whether you're dragging a shape by hand or watching the AI place one.

What "command-driven" means for you

Every change to your design in Lega — moving a layer, changing a fill color, typing a character of text, generating a whole new layout from a prompt — is expressed internally as a discrete, self-contained instruction called a command. A command knows how to apply itself, and it knows how to undo itself.

This sounds like plumbing, but it has a very visible effect: it's the reason undo/redo in Lega is exact and total, not approximate. There's no separate "AI actions" history that behaves differently from "manual edits" history. If the AI regenerates a frame and you don't like the result, undo takes it back exactly the way undoing a manual drag would. See Undo/Redo & History for the full picture of what that buys you.

It also means the editor state at any point in time is just "the result of this sequence of commands." That's a much easier thing to reason about — and to keep correct — than a tool where edits mutate shared state ad hoc.

Plugin-based, not monolithic

The second core idea is that Legon isn't one giant editor class that does everything. It's a small core (canvas state, the command system, selection) with everything else — keyboard shortcuts, history tracking, smart guides, specific tool behaviors — built as composable plugins on top of it. You don't interact with this directly as a user, but it shows up in how consistently features behave: alignment guides, multi-select, and keyboard shortcuts all sit on the same underlying primitives, so they compose the way you'd expect instead of each behaving like a bolted-on special case.

This architecture is also why Lega can add new capabilities — a new layer type, a new AI-assisted refinement mode — without destabilizing the editor you already know. New behavior is new plugins and new command types, not rewrites of the core.

If you're curious about the technical design behind this (it's inspired by patterns from rich-text editors, adapted for a visual canvas), the deep dive is in How Legon's Plugin Architecture Works.

One engine, two ways to draw it

Legon compiles your design into a single internal scene representation, and that scene can then be drawn by either of two rendering backends — a fast Canvas2D renderer (the default) or a legacy SVG-based renderer kept around for compatibility. Because both backends draw from the same compiled scene, what you see while editing and what you get when you export are guaranteed to match — there's no separate "export renderer" that might interpret your layout differently. The details of when each backend is used, and why it's rarely something you need to think about, are covered in Canvas vs Legacy Renderer.

Why this matters for AI-generated designs specifically

Lega's core premise is that AI output should be a real, editable starting point, not a locked image (see What is Lega?). That premise only holds up if the editor underneath can absorb AI-generated content as first-class, ordinary layers — not as some special read-only overlay you have to "unlock" or convert.

Because every AI generation is executed as the same kind of command as a manual edit, and every layer the AI produces is the same kind of layer object as one you draw by hand, there's no seam between "AI content" and "your content" once generation finishes. You can select an AI-placed text layer and retype it exactly the way you'd retype anything else. You can regenerate a single element without disturbing the rest of the frame, because commands are scoped to what they actually touch.

What you don't need to know

None of this requires you to think in terms of commands or plugins while you work — that's the point of building it this way. Day to day, you'll interact with frames, layers, and panels, covered in the interface tour and elsewhere. The architecture is background context for understanding why the editor behaves the way it does: predictable undo, consistent tool behavior, and AI output that's genuinely yours to edit the moment it lands on the canvas.

If you want the full technical picture — command types, plugin composition, the dual-renderer scene compiler — start with How Legon's Plugin Architecture Works, then read Undo/Redo & History for how the history model plays out in daily use.