--- title: Claude Skill description: Install the Wireflow skill once, then build and run workflows by talking to Claude in any project on any machine. updated: 2026-08-05 --- The Wireflow Claude skill is a small bundle of instructions, reference docs, and helper scripts that teaches any Claude Code instance how to build and run Wireflow workflows on your behalf — using your API key, your templates, your credits, and your outputs. Install it once and it works everywhere Claude runs: the `claude` CLI, the VS Code extension, the JetBrains plugin, any project directory on any machine. You don't need to give Claude access to the Wireflow codebase. ## Who this is for - **Founders and cofounders** shipping content at scale who want a one-sentence loop: "Hey Claude, make me 10 variations of this workflow with different prompts." - **Agencies and power users** who want to wire Wireflow into existing Claude-driven pipelines without writing REST clients. - **Developers on other projects** (Gluely, EatIQ, any side project) who need Wireflow's AI models but don't want to leave their current repo. ## What the skill can do - Discover Remotion templates you have access to - Compose workflow node graphs from natural language - Create and update saved workflows in your Wireflow account — layouts are computed automatically, so the canvas you open is always clean - Build [batch image factories](/docs/batch-image-generation): one Compositor template plus a data feed that mass-produces on-brand images (ads, carousels, thumbnails) in a single run - Design and edit Compositor layers programmatically — backgrounds, scrims, headlines, logos — the same layer JSON the visual editor writes - Run workflows with custom inputs and poll async jobs until they complete - Hand back the final output URL (image, video, MP3) or the workflow URL for you to open in the visual editor ## What the skill cannot do - Ship new Remotion compositions. Compositions are React code that lives in the Wireflow repo. Only the Wireflow team can author them. - Replace the visual editor. Anything complex is still better built in the UI first, then called via the skill once it's working. - Bypass credit costs. Every run deducts credits from your Wireflow account — the skill checks your balance before kicking off expensive video jobs. ## Install ### 1. Grab an API key Create one at [wireflow.ai/settings?tab=api-keys§ion=api-keys](/settings?tab=api-keys§ion=api-keys) with these scopes: - `workflows:read` — list workflows and templates - `workflows:write` — create and update workflows - `workflows:execute` — run workflows Copy the key somewhere safe. You won't be able to see it again after the settings page closes. ### 2. Install the skill Clone the skill repo into your Claude skills directory: ```bash git clone https://github.com/wireflowINC/wireflow-skill ~/.claude/skills/wireflow ``` Claude Code automatically picks up any skill in `~/.claude/skills/` — no configuration step needed. Restart your Claude session (or open a new one) and the `wireflow` skill will be available. ### 3. Add your API key to your shell Add this to your shell profile (`~/.zshrc`, `~/.bashrc`, or equivalent): ```bash export WIREFLOW_API_KEY="wf_live_your_key_here" ``` Then either `source` the file or restart your terminal. Optional: set a custom base URL if you're on staging or self-hosted: ```bash export WIREFLOW_BASE_URL="https://staging.wireflow.ai/api/v1" ``` ## Use Open Claude in any directory and ask for what you want. The skill auto-triggers on keywords like "wireflow", "build a workflow", "run a workflow", or "generate a video with a Remotion template." ### Examples **Generate an image from a prompt:** > Build me a Wireflow workflow that takes a product name, has Claude > write a viral TikTok hook, then generates a 9:16 product photo with > Nano Banana. **Run an existing workflow with inputs:** > Run my Wireflow workflow `cmnxw6nt10005l404i62b219o` with the prompt > "a cow in a neon field" and download the result. **Render a video via a Remotion template:** > Use the foodscan Remotion template to make a TikTok about a Caesar > salad being 850 calories — I'll give you the food photo. **Batch with data:** > I have a CSV of 20 celebrity names. For each one, create a Wireflow > workflow that generates a gym selfie and a workout description, then > run them all and give me the output URLs. ## How it works under the hood The skill is a thin wrapper over the Wireflow REST API. When you make a request, Claude: 1. Reads the relevant reference docs from the skill bundle 2. Discovers templates via `GET /remotion/templates` so it knows what's available 3. Either calls the AI workflow generator (`POST /workflows/generate/stream`) or hand-authors a workflow JSON 4. Creates the workflow via `POST /workflows` 5. Executes it via `POST /workflows/:id/run` 6. Polls `GET /workflows/executions/:id/poll` until the job lands 7. Hands you the final output URL Every workflow created via the skill is stored in your Wireflow account and can be remixed, shared, or extended in the visual editor. ## Compositor image layers: crop and rounded corners Two image-layer transform props that agents often miss. Both are plain JSON on the layer (the same shape the visual editor writes), so you set them by hand when authoring or updating a Compositor layer. **`sourceRect` (crop into a region of the source image).** A rectangle in SOURCE-IMAGE pixel space. The layer renders as if the source image were first cropped to that rectangle, and then the layer's `fit` (`cover` / `contain` / `stretch`) applies to the cropped region. Use it to zoom into part of a screenshot or product photo without pre-cropping the file. Shape: ```json { "type": "image", "x": 0, "y": 0, "width": 1080, "height": 1920, "fit": "cover", "sourceRect": { "x": 120, "y": 400, "width": 840, "height": 1200 } } ``` That example takes an 840x1200 region of the source starting at pixel (120, 400) and covers the 1080x1920 layer box with it. `x`/`y` must be zero or positive; `width`/`height` must be positive. Out-of-range values are clamped to the image bounds at render time (they never throw), so a rect that spills past the edge is trimmed to what remains. Omit `sourceRect` and the image renders exactly as before (the whole image feeds the fit). **`cornerRadius` (rounded corners on images).** Already supported on image layers. Set `cornerRadius` (pixels, 0 to 10000) to round the image corners; the server also reads `borderRadius` as an alias for the same value. It works everywhere the crop does (editor preview, PNG export, headless render): ```json { "type": "image", "width": 600, "height": 600, "fit": "cover", "cornerRadius": 48 } ``` **Per-corner radii.** `cornerRadius` also takes a four-number tuple, in CSS `border-radius` order: `[topLeft, topRight, bottomRight, bottomLeft]`, clockwise from the top-left. It works on rectangle layers and image layers, on every surface (editor canvas, PNG bake, HTML export). The case it exists for is message grouping in a chat mock. Real DM clients flatten only the corner facing the next bubble from the same sender, so a run of messages is a stack of pills with one squared-off edge each. Uniform pills on every bubble is the clearest tell that a screenshot is fake: ```json { "type": "rectangle", "width": 520, "height": 92, "fill": { "kind": "solid", "color": "#3797F0" }, "cornerRadius": [46, 46, 8, 46] } ``` That is a pill everywhere except the bottom-right, which is where the next message from the same sender sits. The last bubble in the run goes back to a plain `46`. Radii that overlap are clamped exactly like CSS: for each side, divide the side's length by the sum of its two radii, and if the smallest of those four ratios is below 1, every radius is scaled by that same factor. All four are scaled together, so the shape stays proportional instead of one corner being lopped off. Anything that is not a number, a `"N%"` string or a 4-number tuple is **refused**, not repaired: a 2- or 5-entry array, a negative, a `NaN` or a string like `"8px"` fails the render with an error naming the layer, the value received and the accepted forms. (It used to be silently treated as zero, which rendered four sharp corners with no diagnostic anywhere.) Both `sourceRect` and `cornerRadius` apply to Compositor renders only: the editor preview, the PNG export, and the headless (API) render. Remotion composite scenes have their own layer schema and do not support them yet. ## More endpoints **Duplicate a workflow** — `POST /workflows/:id/duplicate` clones a workflow you own or one shared with you (secrets are stripped when you're not the owner). Optional `{ "name": "..." }` sets the copy's name; the default is `" (copy)"`. Returns the new `id` and editor `url`. ```bash curl -X POST "$WIREFLOW_BASE_URL/workflows/$ID/duplicate" \ -H "Authorization: Bearer $WIREFLOW_API_KEY" \ -H "Content-Type: application/json" \ -d '{"name":"My remix"}' ``` **Lint a graph** — `POST /workflows/lint` runs the same determinism gate the editor uses (unresolvable handles, cycles, unknown node types, caps) without touching your account. Send `{ nodes, edges }` or a full workflow object. Use it to check a hand-authored graph before you create it. The graph is normalized first, exactly the way `POST`/`PUT` normalizes it, and then linted, so this verdict and the save verdict can never disagree. You get back: - `ok` — `false` means a create/update would refuse this graph under the default strict mode. - `violations` — the blocking errors, each with `rule`, `nodeId`/`edgeId`, `fix`. - `warnings` — non-blocking lint findings. - `migrations` — what the save would repair for you: ports materialized (template ports, compv3 `$port:` references), deprecated node types migrated. This is why an edge you thought was dangling can lint clean. - `notes` — warnings and reconcile notes flattened to readable strings. - `diagnostics` — `{ version, counts, diagnostics[] }`, each with a stable `code`, `severity`, `target` and `hint`. Same shape the write path returns. Branch on `code`, not on message text. ```bash curl -X POST "$WIREFLOW_BASE_URL/workflows/lint" \ -H "Authorization: Bearer $WIREFLOW_API_KEY" \ -H "Content-Type: application/json" \ -d '{"nodes":[],"edges":[]}' ``` **Patch one node.** `PATCH /workflows/:id/nodes/:nodeId` changes a single node's `config`, `params`, `label`, or `position` without round-tripping the whole graph. This is the right way to change one prompt: you send a few bytes instead of GETting a 60KB workflow, editing one word, and PUTting it all back (which can silently clobber a teammate's concurrent edit). Send at least one of `config`, `params`, `label`, `position`. `config` and `params` are shallow-merged onto what's there, so keys you don't send are kept. A key set to `null` deletes it. You cannot patch runtime outputs or structural fields (`nodeType`, `inputs`, `type`, and so on); those return `400 invalid_field`. The response is just the patched node plus the new `updatedAt`, not the full graph. ```bash # Change one node's prompt. curl -X PATCH "$WIREFLOW_BASE_URL/workflows/$ID/nodes/$NODE_ID" \ -H "Authorization: Bearer $WIREFLOW_API_KEY" \ -H "Content-Type: application/json" \ -d '{"config":{"prompt":"a cow in a neon field"}}' ``` Concurrency: the server rejects a patch that races another write with `409 stale_write` (it only applies your patch if the workflow is unchanged since it read it). Pass the `updatedAt` you last saw as `baseUpdatedAt` to also detect staleness from when you loaded the workflow. On a 409, GET the workflow again and retry the patch. ### Single-node runs re-run downstream free nodes When you re-run one node, its downstream FREE nodes refresh automatically: compositor, output preview, extractors, and logic nodes. They cost $0 and always react to fresh upstream data, so you never have to re-run them by hand. PAID nodes (llm, generate, edit, video) never auto-fire, so a re-run upstream will not quietly bill you for a Kling or Veo job downstream. This is the Reactivity Contract: free nodes react, paid nodes wait for you. ## Guardrails - **Sets of outputs use a factory, not repeated re-runs.** To produce several distinct results (variations, one per audience, a batch of five), do NOT change one node's prompt and re-run it N times, and do NOT inject N different inputs into a single node. A saved workflow keeps only the LAST prompt, so the other N-1 are lost and the node's saved prompt stops matching its saved image. That leaves a broken, misleading template, especially once it is published. Build a [batch image factory](/docs/batch-image-generation) instead: a data feed (a list / build_data node) holds every brief, an iterator fans them out to the generate node, and every item stays a first-class, visible part of the graph. Rule of thumb: if you are about to run the same node more than once with different inputs, you want an iterator. Before you publish, confirm every node's saved prompt matches its saved image. - **Scoped API keys.** Grant read-only, write-only, or execute-only access per key. Rotate or revoke any time. - **Credit awareness.** The skill checks your balance before running expensive video jobs (Kling, Veo, long Remotion renders) and confirms with you first. - **Private templates stay private.** Templates with `allowedEmails` restrictions stay hidden from API keys outside the allowed list. No cross-account leakage. - **No codebase access.** The skill talks to your account via HTTPS and your API key. It doesn't need access to the Wireflow source. ## Next steps - [Create an API key](/settings?tab=api-keys§ion=api-keys) - [Browse available Remotion templates](/workflows) in the visual editor - [Read the full REST API reference](/docs/api/overview) --- Documentation index: fetch https://www.wireflow.ai/llms.txt for the full list of Wireflow docs.