JsonCutDocs

Project quickstart

Create an editable project, render it and download the result.

This walkthrough creates a durable image project. The same flow renders videos by setting compositionKind: "video", a real FPS and a longer duration.

Rendered output

API reference cover

The rendered result of a compact image project using editable text, grouped vector decoration and ordinary CSS.

API reference cover
Image1200 × 630Editable V2 source

1. Set credentials

export JSONCUT_API="https://api.jsoncut.com"
export JSONCUT_API_KEY="jc_live_..."

Create keys in Studio → Settings → API keys. Do not put them in frontend code.

2. Create project.json

{
  "description": "Editable launch artwork",
  "source": {
    "format": "jsoncut-html",
    "version": 1,
    "id": "launch-artwork",
    "name": "Launch artwork",
    "compositionKind": "image",
    "canvasBackground": "#101217ff",
    "width": 1080,
    "height": 1080,
    "fps": 1,
    "duration": 1,
    "html": "<h1 id=\"title\" data-jc-clip data-jc-kind=\"text\" data-jc-name=\"Title\" data-jc-start=\"0\" data-jc-duration=\"1\" data-jc-track=\"1\" data-jc-bind-text=\"headline\">Launch faster.</h1>",
    "css": "#title{position:absolute;left:120px;top:410px;width:840px;height:260px;display:flex;align-items:center;justify-content:center;text-align:center;color:#fff;font:800 88px/1 Inter,sans-serif}",
    "variables": [{ "id": "headline", "label": "Headline", "type": "string", "default": "Launch faster." }],
    "values": { "headline": "Launch faster." },
    "customBlocks": []
  }
}

3. Create the project

curl -X POST "$JSONCUT_API/api/v2/projects" \
  -H "X-API-Key: $JSONCUT_API_KEY" \
  -H "Content-Type: application/json" \
  --data @project.json

Save the returned project id and numeric version.

4. Render

curl -X POST "$JSONCUT_API/api/v2/projects/$PROJECT_ID/renders" \
  -H "X-API-Key: $JSONCUT_API_KEY" \
  -H "Idempotency-Key: launch-artwork-v1" \
  -H "Content-Type: application/json" \
  -d '{"kind":"image","format":"png","transparent":false,"retention":"project"}'

The response is asynchronous and contains a render ID.

5. Poll and download

curl "$JSONCUT_API/api/v2/renders/$RENDER_ID" \
  -H "X-API-Key: $JSONCUT_API_KEY"

curl "$JSONCUT_API/api/v2/renders/$RENDER_ID/artifact" \
  -H "X-API-Key: $JSONCUT_API_KEY" \
  --output launch.png

For production, prefer signed webhooks over frequent polling.

Continue with Create with V2 for layers, hierarchy, media, motion, captions, variables, compositing and custom blocks.