← Back to PopCraft

AGENTS &
API!

An agent in the editor that edits with the same commands you click. A command line that runs them on files in a terminal. A REST API for your CI. A design kit on npm. One set of commands under all of it.
TRY IT FREE →
Ask the agent, and watch it edit0:08

A launch post, signed in. The background is selected and the agent panel opens. “Make the background a deep purple” is typed and sent; the agent says what it will do, calls set_fills on the selection, and the background turns purple on the canvas. The edit is one undo step.

THE BIG IDEA

Every feature is a command

Here is the rule we build PopCraft by: if the editor can do it, it is a command. Creating a layer, setting a fill, applying a motion preset, exporting a PNG. Each one is a named command with typed parameters, in one registry. The menus call it. The palette calls it. The agent calls it as a tool. The CLI and the REST API call it. Plugins call it too.

That sounds like plumbing, and it is, but it is the plumbing that makes everything else on this page honest. The agent cannot do a weird half-version of a feature, because there is no second version. A script you write against the CLI today runs the same command your designer clicked this morning. When we add a feature, it is written once and every door reaches it. (The CLI and the API take the ones that need no screen; the rest run in the editor.)

node.create
also answers to create_node (agent) and createNode (plugins)
MENUS
Click it
PALETTE
⌘K, type, Enter
AGENT
Ask in words
CLI
popcraft run
PLUGINS
popcraft.createNode()
REST API
POST …/commands
220
commands in the registry
135
run headless from the CLI
100
commands per API request, one save
120
API requests a minute per token
IN THE EDITOR

Ask for the result, not the steps

Open the Agent panel from the rail, select what you mean (or @-mention it), and say what you want: “make the background a deep purple”, “type the headline on letter by letter, then pop the badge in half a second later”. The agent reads the layers, picks the commands and runs them on the canvas while you watch.

Every edit it makes is one undo step, named for what it did, so “no thanks” is one keystroke. The tools that could really hurt, like deleting a file, publishing to a library or running a plugin, stop and ask you first. The agent is a signed-in feature and uses your plan’s AI credits.

Ask the agent, and watch it edit0:08

A launch post, signed in. The background is selected and the agent panel opens. “Make the background a deep purple” is typed and sent; the agent says what it will do, calls set_fills on the selection, and the background turns purple on the canvas. The edit is one undo step.

TEACH IT

Skills: how your team does things

The agent ships with skills, short instruction sheets it pulls in when a job matches: Fill content, Auto layout, Recolor, Motion design and more. It also has agent profiles, personas it hands parts of a job to when it splits the work up.

Click Manage, pick a skill and Duplicate it to make your own. In the desktop app you can also drop markdown files into its skills/ and agents/ folders, keep them in git, and the app picks up each save without a restart. A file is never a permission: a tools: allowlist can only narrow what the agent may call, and the tools that ask for confirmation cannot be named in one at all.

Make a built-in skill your own0:07

A launch post in the editor. The agent panel opens and Manage lists the built-in skills, each an instruction sheet the agent pulls in when a job matches. One is opened and Duplicate makes an editable copy of it, with its name, when to use it and its instructions.

⌘K

The palette is the same registry

Press ⌘K and type. The palette searches the commands by what they do, so you never have to remember which menu something lives in. Enter runs it on your selection.

It is also the friendliest way to learn the CLI. The thing you just ran from the palette is a command with an id, and popcraft commands will tell you its flags.

Every feature is a command0:05

A launch post with its message selected. ⌘K opens the command palette and “align” is typed: the align commands are listed. Align left is picked and the message’s lines line up on their left edge.

IN A TERMINAL

The popcraft command line

popcraft runs PopCraft’s commands on .popcraft files on disk, with no editor open. This is a real session, with the output it printed. A command answers to its id, its agent tool name or its plugin method, and its flags come straight from its parameters.

~/launch — popcraft
$ npm i -g @popcraft/cli
$ popcraft new poster.popcraft --name Poster
Created poster.popcraft
$ popcraft run poster.popcraft node.create --type RECTANGLE --width 320 --height 200 --fill "#ff0055"
Created rectangle "Rectangle"
Saved poster.popcraft
$ popcraft run poster.popcraft doc.outline
Outline of Page 1: 2 layers
$ popcraft commands | tail -1
135 commands that run from the CLI (--all lists every command, with where the rest run).
# exports render in a headless editor (npm i -g puppeteer)
$ popcraft run poster.popcraft export.nodes --ids "$ID" --format PNG --scale 2 --out poster.png
# the same commands on a cloud file, merged live for whoever has it open
$ popcraft run cloud:abc123 --batch @steps.json --if-match y1234
$ popcraft push poster.popcraft

HEADLESS

Edit files in CI with no window. Exports and vision.lookAt need the GPU canvas, so they run in a headless editor through puppeteer.

CLOUD FILES

cloud:<key> runs on a cloud file through the API. push and pull move whole documents.

THE APP

With the desktop app running, popcraft run --ui runs in the open tab, as you, so you can watch it happen.
OVER HTTP

A REST API, with the same commands

The API lives at /api/v1 and is described by an OpenAPI 3.1 document you can feed to any client generator. Read files, nodes, images and versions. Read and write comments. Create files, replace a document, and for targeted edits, post commands: up to 100 run in order and are saved as one edit. A step can use what an earlier one returned, so "$0.id" is the frame step 0 created.

POST /api/v1/files/{key}/commands
curl -X POST "https://popcraft.app/api/v1/files/$KEY/commands" \
  -H "Authorization: Bearer pop_…" -H "content-type: application/json" -d '{
  "commands": [
    { "command": "node.create", "params": { "type": "FRAME", "name": "Card", "width": 320, "height": 200 } },
    { "command": "node.create", "params": { "type": "TEXT", "text": "Hello", "parentId": "$0.id" } },
    { "command": "paint.setFills", "params": { "ids": ["$0.id"], "color": "#ff0055" } }
  ]
}'

If a step fails, nothing is saved and you get a 422 that says what each step did. "dryRun": true saves nothing either way. Every file response carries a revision; send it back as If-Match and a write only lands if nobody changed the file in between. People editing at the time see the change merge in as if a collaborator made it, and before the first write in 30 minutes the file’s current state is kept as a version.

KEYS

Tokens with scopes, not skeleton keys

Make a personal access token from the account menu. Its secret starts with pop_ and is shown once. A token acts as you, so it can only reach files you can open, and never more than its scopes allow: files:read, files:write, comments:read, comments:write, versions:read, marketplace:publish, sites:publish and integrations:read.

Errors come back as JSON with a stable code, a 404 never tells you whether the file exists, and revoking a token takes effect within a minute.

Make a personal access token0:07

Home, signed in. The avatar opens the account menu and Personal access tokens lists the tokens there are. A new one is named “CI publish”, given a scope, and created; its secret is shown once, ready to copy into the service that calls the API.

PLUGINS

Your own tools, in the editor

Plugins are small web bundles that run in a sandbox, read and edit the open file through the same commands, show their own panels and put widgets on the canvas. Share them with your team or publish them to the marketplace.

A plugin writing to the file0:06

A launch post with its headline selected and Pop Palette installed. Run calls the plugin’s main script, which writes to the file through the popcraft API: a pop-art palette appears as colour styles under Local colors, in one undo step.

A plugin with its own panel0:08

A brainstorm board with its eight sticky notes selected and Rename Layers installed. Run opens the plugin’s own panel beside the canvas, a sandboxed page that reads the selection. The pattern is set to “Idea #” and Rename renames all eight layers, which the layers panel shows.

Asking the agent for motion0:08

A launch post, signed in. The Agent rail button opens the agent panel. The headline is selected, and a request is typed in words — type the headline on letter by letter, then pop the badge in half a second later — ready to send. Manage lists the skills it can pull in, Motion design among them.

The marketplace, from the editor0:07

The editor with a landing page open. The Marketplace button on the right rail opens the marketplace: plugins, templates, libraries and themes, with categories and a search. Templates and then Motion narrow it to animated templates, and clicking one (Synthwave tunnel visualizer) opens its listing, with its preview and description. Installing needs an account.

CODE ALL THE WAY DOWN

Four packages on npm

@popcraft/cli

The popcraft command: edit files headlessly, build designs from scripts, render and export, call the API, publish to the marketplace and drive the desktop app.

@popcraft/kit

Everything our own templates are made with: the Kit, every helper and style system, every official template’s source, the checks, and types for your editor. runDesign() builds a design script inside your own program.

@popcraft/runtime

What exported code shares: expressions, prototype and state machine players, a site’s forms, sign-in and records, and the Next.js Commerce types storefronts bind to.

@popcraft/plugins

The plugin SDK: the types plugins and widgets are written against, for autocomplete while you build one.
FOR CODING AGENTS

Design like the gallery does

Claude Code, Codex, Cursor: an AI coding agent in a terminal can make real PopCraft designs with the CLI and nothing else. It works the way our template gallery was made. It writes the whole design as a script, builds it with write_design, and gets back checks: text that fails contrast, text too small for the size, text off the frame, text under the buttons Instagram, TikTok and Shorts draw on top, and text overlapping text.

Then it renders the frames with vision.lookAt, looks at the pictures, fixes the script and builds again in place with --frame. The loop is the whole method, and our public guide, Designing with an AI agent, is the page to hand it. The result is an ordinary .popcraft file a person can open and keep editing.

  1. Install the CLI

    Run npm i -g @popcraft/cli (Node 25 or newer), or brew install getpopcraft/popcraft/popcraft for one executable with no Node.
  2. Make a token

    Account → Personal access tokens. Give it only the scopes it needs. The secret starts with pop_ and is shown once.
  3. Log in

    popcraft login --token pop_… keeps it in your system keychain. popcraft whoami checks it.
  4. Find the command

    popcraft commands lists what runs; popcraft commands paint.setFills shows a command’s flags.
  5. Run it

    On a file on disk, or on cloud:<key>. Add --dry-run to see what would happen first.
  6. Wire it into CI

    Batch steps into one save, keep going past failures if you want, and read --json output in your scripts.
THE OLD WAY

Design tool with an API bolted on vs. one set of commands

THE OLD WAYIN POPCRAFT
A read-only API, and the real work by handRead, create and edit files, run commands, post comments
An AI feature that does its own thingThe agent runs the commands the editor runs, one undo step each
Exports only from the app windowpopcraft run … export.nodes in a headless editor
Scripts that clobber what people are doingIf-Match revisions, and edits that merge in live
One giant API keyPersonal tokens with eight scopes, revoked within a minute
START HERE

Three lines to your first design from a terminal

npm i -g @popcraft/cli, then popcraft new poster.popcraft, then popcraft run any command on it. When you want it in the cloud, popcraft push prints its key. The command line docs cover every flag, and the endpoint reference every route.

ASKED & ANSWERED

Questions, answered

What can the agent in the editor actually do?

It runs the same commands the editor does, as tools: creating and editing layers, auto layout, recolouring, motion, compositions, audio, exports and more. Every edit it makes is one undo step, named for what it did. Tools that delete a file, publish to a library or run a plugin ask you to confirm first.

Does the agent need an account?

Yes. The agent and other AI features are signed-in features and use your plan’s AI credits. The skills and profiles editor works without an AI call.

Can I teach it how my team works?

Write skills: short instruction sheets the agent pulls in when a job matches. Duplicate a built-in one in the panel and change it, or in the desktop app drop markdown files into the skills/ or agents/ folder. A tools: allowlist can only narrow what a skill or profile may call, never widen it.

What does an API token let a script do?

Only what you can do, and only what its scopes allow: files:read, files:write, comments:read, comments:write, versions:read, marketplace:publish, sites:publish and integrations:read. Revoking one takes effect within a minute.

What happens if my script and a person edit at the same time?

Every file response carries a revision. Send it back as If-Match and the write lands only if nobody changed the file in between; otherwise you get a 409 with the current revision to retry from. Command runs merge in live for the people in the file.

Can a coding agent like Claude Code or Cursor make designs?

Yes, with the CLI and nothing else. Our public guide, “Designing with an AI agent”, is the loop to hand it: write the design as a script, build it, check it, render it, look at the pictures, fix, and repeat.

THE MANUAL, FOR THE DETAILS

BEEP! YOUR TURN.

An agent in the editor, a CLI, a REST API and a kit. Free to start, in your browser or on your Mac.

OPEN POPCRAFT →