Render Instagram carousels from one command

The problem

Carousels are the highest-effort post format. Dragging text boxes in a design tool eats an hour per post, and by carousel ten your colors and fonts have quietly drifted. The obvious shortcut, asking an AI image model to draw finished slides, fails differently: the model misspells words and invents its own palette. Neither path scales.

What I built

One command in Claude Code: /content-os:carousel. I type a one-line idea and three separate jobs run, each with the right owner.

Claude writes the copy. It reads my brand profile first, then writes a cover hook, 5 to 8 slides with one idea each, and a CTA slide, in my proof-first voice. It gives me 3 or 4 A/B cover hooks instead of one take.

Deterministic code renders the pixels. Claude does not draw anything. It writes a carousel.json spec, and a bundled Node script renders it with Satori into 1080x1350 PNGs. Colors and fonts come from a design system file, so every slide uses the exact brand hexes and typefaces. Same spec in, same pixels out, every time.

I approve. I pick the winning hook, review the slides and caption, then stage the set for publishing. Nothing ever auto-posts.

That separation is the whole trick. Language models are great at copy and unreliable at pixels: let a model paint your headline and it can misspell it. When code draws the text from a spec, the headline is always spelled right, always in your colors.

Steps you can copy

You do not need my plugin to steal the pattern. First, make Claude output a spec, not a design:

Write an Instagram carousel about <your idea>.
Cover hook, 5 to 8 slides with one idea per slide, then a CTA slide.
Give me 3 A/B options for the cover hook and let me pick.
Output the carousel as JSON: one object per slide with
type, headline, and body. Write the spec only, design nothing.

Second, ask Claude Code to build the renderer once:

Build a Node script that reads carousel.json and renders each slide
as a 1080x1350 PNG using Satori. Read all colors and fonts from a
separate design-system.json file. Never hardcode a hex or a font.

Third, put your brand in that design system file so it lives in one place:

{
  "colors": { "background": "#F0E7D2", "accent": "#C15F3C" },
  "fonts": { "display": "Space Grotesk", "body": "Inter" }
}

Rebranding later is editing one file and re-rendering, not redesigning old posts.

Do this now

1. Run the spec prompt above on your next post idea and pick a hook from the A/B options.
2. Ask Claude Code to build the Satori renderer and a design-system.json with your colors.
3. Keep one rule forever: the agent writes, code renders, you approve before anything posts.