Guides
Agents convert Figma node JSON into commit-ready UI. They do not invent layout or freehand pixel CSS from screenshots when node data exists.
| Do | Do not |
|---|---|
| Obtain real Figma node JSON or design URL + token | Guess layout from screenshots when nodes exist |
| Call Calque for structure + styles | Ask an LLM to rewrite Calque structure “for quality” |
Write files[], then wire data/routes |
Expect the server to read the user repo paths |
| Scan index locally; send in the request | Require a Calque API key (there is none) |
[ ] Figma URL + FIGMA_TOKEN OR design.json / calque-dump
[ ] POST https://calque.flowsrun.com/v1/convert (or calque convert)
[ ] Parse files[] → write to disk
[ ] Optional: --repo / index for real component imports
[ ] Optional: POST /v1/check for determinism
[ ] Integrate props, data fetching, navigation{
"mcpServers": {
"calque": {
"command": "bun",
"args": ["run", "--cwd", "/absolute/path/to/calque", "mcp"]
}
}
}Tools: calque_convert · calque_scan_index · calque_check. Prefer file paths over inlined megabyte dumps. Full tool schemas: MCP tools.
Product policy: AI generates layout = reject. AI consumes Calque via MCP = correct layer — agents orchestrate, Calque emits deterministic code. That keeps PRs reviewable and CI meaningful.