Bogen

Frequently asked questions

Short answers, each from a guide that goes into detail.

What is Bogen?

An open source design canvas where every design is real HTML and CSS. You draw on it in the browser, and your own coding agent draws on it through an MCP server. See the overview.

What does it cost?

Nothing. Bogen is MIT licensed, with no account, subscription or usage cap. Agent work runs on the plan you already have for Claude Code or Codex, or whatever your own MCP client uses. Two things can cost money, and both are yours to start: image generation with your own OpenAI or Gemini key, and the usage of your agent's plan.

Which agents work with it?

Any MCP client. bogen install sets up Claude Code, Codex, Cursor, VS Code, OpenCode, Gemini CLI and Zed. Claude Code and Codex have been set up and run for real; the others follow their documented config formats and have not been tried with the apps yet. Any other client connects to bogen mcp or to http://127.0.0.1:29990/mcp. See Agents.

The prompt bar (Ctrl+K) and mentions in comments start Claude Code or Codex, the two CLIs Bogen knows how to run.

Do I need an API key?

No. Bogen calls no model itself. The prompt bar and comment runs use your logged-in claude or codex CLI. A key is only needed for image generation.

Does it work offline?

Yes, for everything on your machine: the canvas, your files, your agent's tools, renders and exports. Fonts from Google Fonts need the network; without it, text in those fonts falls back to another font. Fonts installed on your machine, and fonts Snapshot kept in a file, need none. Your agent itself needs whatever its provider needs. See Privacy.

Does it send my designs anywhere?

No. Files stay in your data folder, and the server only listens on this machine unless you tell it otherwise. There is no telemetry. Privacy lists every network request Bogen makes and when.

Does it run on a Mac or Windows?

Bogen is a Node program and is developed and used on Arch Linux with Omarchy.

Can my team use it together?

Several people can work in one file at the same time, with cursors, selections, comments and follow. For that they reach your server: bogen serve --host <address> --token <secret> makes it listen beyond this machine, with one shared token. There are no accounts, roles, per-file permissions, share links or single sign-on yet.

Between your own devices, device sync keeps the same files on each.

Where are my files?

In ~/.local/share/bogen (or $XDG_DATA_HOME/bogen, or $BOGEN_HOME). Each file is a document in files/, images and fonts in assets/, history in history/. To take one with you, download it as a .bogen file from the home screen, or write it as a design folder for Git.

How does it relate to Figma?

They are different tools. Figma has its own document format; in Bogen every layer is an HTML element with CSS. Bogen can import a Figma file through Figma's public REST API with your own token, and many Figma keyboard shortcuts work as aliases. It does not read Figma's clipboard or .fig files.

How does it relate to Paper?

Paper is a separate design tool. Bogen is written from scratch, with its own tool names, schemas and formats. Its shader layers use the @paper-design/shaders library, which is Apache-2.0 licensed.

Bogen is an independent project, not affiliated with Figma or Paper.

How finished is it?

Version 0.1.0 is not released yet. The guides say where a feature works only in part, and the changelog lists what is in this version.

Is there a browser extension for Snapshot?

No. Snapshot runs from the command line, from your agent and over HTTP. See Snapshot.

Can an agent do something I did not ask for?

An agent can do what its tools allow in your files, as it could in your editor. Bogen limits the rest: runs started from the canvas get Bogen's tools only, with no shell or file access; nothing written in a document, a comment or a brand starts a process; agents leave locked layers alone; and every agent step can be undone on its own. Work you want to review first can go into a proposal.