Ignaru

how it fits together

ignaru is a design canvas that lives in your repo. the canvas is the.ignaru folder: every node is a folder with an index.html, so git, your editor and any agent can open it.

your agent claude code, codex,cursor, gemini mcp, stdio ignaru-studio npx -y ignarucli mcp --root. reads, writes .ignaru/ canvas.json nodes/<id>/ index.html node.json comments.json annotations.svg or the files, directly the canvas the mac app you draw, comment same files your agent claude code, codex,cursor, gemini mcp, stdio ignaru-studio npx -y ignarucli mcp --root. reads, writes .ignaru/ canvas.json nodes/<id>/ index.html node.json comments.json annotations.svg same files the canvas the mac app you draw, comment or the files, directly

your agent talks to the ignaru-studio server over mcp. the server reads and writes the.ignaru folder in your repo, and the mac app opens the same files. any other agent can skip mcp and use the files.

install

the mac app is the canvas. you can also run the canvas tools headless, with no app open, from any project:

npx -y ignarucli mcp --root .

that serves the ignaru-studio mcp server over stdio from ignarucli on npm. it reads and writes.ignaru in the folder you pass as --root.

connect your agent

your agent keeps running on the subscription you already pay for. connecting adds the ignaru-studio mcp server, and for claude code and codex the ignaru plugin with its design skills.

in the app, connect your agent is on home and in the account menu: one click for claude code, codex, cursor or gemini. or add the server by hand:

terminal, in your projectshell

claude mcp add ignaru-studio \
  -- npx -y ignarucli mcp --root .

the docs

• canvas basicsnodes, what each action on the canvas does, and every shortcut.
• the design checkwhat your agent reads after each page, and the sixteen habits it looks for.
• mcp toolsthe ignaru-studio server and the canvas tools agents use most.
• cli and mcpget a key, install the ignaru command, and see every command, mcp tool and rest route.
• agent skillone line installs the ignaru skill in your agent.
• ignaru for agentsthe first call, the rules, how to save calls, and the tool or command for each job.

pricing and questions

the canvas is free. pro pays for design runs: the library and a taste check on every page. see pricing.

what is ignaru?

a design tool where your own coding agent designs with you. you and claude code or codex work on one canvas, and every page is real html in your repo.

which agents work with it?

claude code, codex and cursor. claude code and codex also get the ignaru plugin with its design skills. gemini cli and any agent that speaks mcp can use the canvas too.

do i pay for ai credits?

no. your agent runs on the plan you already have. pro is $20 a month and pays for design runs and the library of finished pieces.

does the app have to be open?

no. your agent can work on the canvas from the terminal with the app closed: npx -y ignarucli mcp --root.

where do my files live?

in your repo. every page is an index.html in a.ignaru folder, with your notes and drawings beside it.

can i start from my live site?

yes. bring any live page onto the canvas as html that you and your agent can change.

can my team use one canvas?

yes. people and agents work on the same canvas, and each page says who made it.

what do i get at the end?

html, a react component or a pull request on your repository.