Pantograph

About this plugin

Pantograph turns a JSON description of your screens into native Figma frames: real text nodes, real vectors, real auto-layout. Not an image, not a screenshot.HOW IT WORKS, AND WHAT IT NEEDS FROM YOUThis plugin is half of a two-part workflow, and it is worth being clear about that before you install it.Pantograph does not read your codebase and it does not generate designs on its own. It draws a manifest that something else writes. In practice that "something else" is a coding agent you already use (Claude Code, Cursor, Codex), pointed at your repo with the agent brief the plugin hands you. The agent reads your source and writes the manifest; the plugin builds the frames.The brief is one button. Open Reference, press "Copy the agent brief", paste it into your agent, and name the pages you want. It is the full spec, and the plugin ships a headless checker so the agent can validate its own work before you ever open Figma.If you don't use a coding agent you can still write the JSON by hand, and the Reference screen documents the whole vocabulary. But the plugin is designed for the agent workflow, and that is where it earns its keep.FOUR STEPS, AND NOTHING IS DRAWN UNTIL THE LAST ONEThe panel walks the work in the order it happens. Drop a manifest, pick the frames, say where they land, then read exactly what will happen before it happens.That fourth step is the point. The review screen lists every selected frame with the operation it will get, create, rebuild or keep, names the section and the page above it, and puts "Back to edit" beside the button. You are never guessing what a run is about to do to your canvas.WHAT YOU GETNo coordinates anywhere. The manifest describes structure: nesting, spacing and alignment. The plugin resolves the geometry with Figma auto-layout, so a longer label or a wrapped line reflows instead of breaking the layout.No coordinates anywhere. The manifest describes structure: nesting, spacing and alignment. The plugin resolves the geometry with Figma auto-layout, so a longer label or a wrapped line reflows instead of breaking the layout.Overlays that behave. Dropdowns, row menus, popovers and badges take an anchor name instead of a position, and flip automatically when they would leave the frame.Runs are additive by default. A frame that already exists is skipped, never overwritten. An optional Replace tick rebuilds a frame in place; it is off unless you turn it on, and each frame is its own undo step.Validate before you draw. Every schema problem is reported at once, grouped, with the path to the node and a suggested fix. Validate never touches your canvas, and it is safe to press at any time.A fit report after you draw. A Figma frame does not scroll, so content past its edge is simply outside it. The report names every frame that overflowed and the size it should have been, ready to paste back to your agent.Frames trace back to their source. Each screen records the file it came from, and an optional tick writes that path above the frame, so a designer looking at it in six months can tell where it came from without opening the panel.Draw a subset. Tick individual frames, or override the section name andframes-per-row, without editing the file.A font that isn't installed asks rather than fails. A CSS stack or a generic like "monospace" names no installable file, so the run stops and offers the closest face you do have, naming each swap. Drawing with a typeface nobody signed off on is your call to make, not the plugin's to make quietly.Opens with an example you can load in one click, so you can see what it does to a canvas before you have a manifest of your own.WHAT IT DOESN'T DO YET (v0.2)No Figma Variables binding. The theme resolves to raw values. Binding it to a variable collection is the obvious next step, and is why the theme is one block rather than sprinkled through the manifest.One solid fill per node. No gradients.No table or grid primitive. Tables are built from stacks and rows with fixed tracks: verbose, but a new table shape never needs a plugin update.Vector artwork comes in as SVG markup. Raster images come in as base64 through the image node.Shadows take raw Figma effect objects rather than effect styles.The builtin glyph set is eleven icons and does not grow. Everything else comes through as raw path data lifted from your own icon set, which is deliberate: the icon set is your app's, so a new icon is never a plugin update.PRIVACYNo network access, no account, no data collection. The manifest setsnetworkAccess to none, so Figma blocks any request at runtime. There is no server to send anything to. Nothing is stored: no client storage, no cookies. The JSON you provide is read in memory and discarded when the run ends. The plugin reads only section names and frame names on your current page, to find its target and see which frames already exist. It writes new frames into one section, and touches an existing node only when you tick Replace. It has no runtime dependencies.