# Clawify Studio

> Free, no-login social-post template editor (studio.clawify.dev). Designs are
> portable `.clawify.json` files that any AI can author; importing one makes
> every element editable and exportable as pixel-exact Instagram PNGs
> (1080×1080 / 1080×1350 / 1080×1920, multi-page carousels). No backend —
> everything stays in the user's browser (IndexedDB).

Important: the app is a hash-routed SPA, so fetching app URLs returns an empty
HTML shell. Use the static docs below; do not try to scrape `#/…` routes.

Integration paths, in order of preference:

1. **MCP server** (agentic tools): `npx -y clawify-studio-mcp` — tools
   `get_design_format` (returns the schema guide) and `create_design`
   (validates a design and returns an import link).
2. **Import deep link** (any AI, no tools): author `.clawify.json` v1 JSON,
   base64url-encode it (UTF-8, `+`→`-`, `/`→`_`, strip `=`), hand the user
   `https://studio.clawify.dev/#/i/<base64url>`. Cap: 300 000 chars — designs
   with embedded images should be saved as a `.clawify.json` file instead.
3. **File / paste**: give the user a `.clawify.json` file to drag into a
   project, or JSON to paste into the in-app ✦ AI 設計 dialog.

## Docs

- [Design file format spec (v1)](https://studio.clawify.dev/design-file.md):
  complete `.clawify.json` reference — canvas, pages, text/shape/sticker/image
  elements, text marks, palette, deep-link encoding. Read this before authoring.

## Ecosystem

- [clawify-studio-mcp on npm](https://www.npmjs.com/package/clawify-studio-mcp):
  MCP server source of the same schema guide, plus validation.