FAQ

Quick answers to the things people ask most. Each one links to the fuller explanation if you want it.

The basics

What is CRAYON-C4? An interactive architecture diagram tool. It draws a software system from three angles that share one underlying model: C4 for structure, deployment for what runs where, and F4 for how work moves through the system. Start with the three views of a system.

Do I need to install anything? No. It runs in the browser with nothing to install. There is also an optional VS Code extension if you want to generate and view diagrams next to your code.

What does "C4" mean? It's a way of describing software structure at four levels of detail — from a single big-picture box down to fine components. See C4 structure.

What is F4, then? A behavioral notation that complements C4 — swimlane flows showing who does what, in what order. The name is a notation name, not a level system. See F4 flows.

Saving and privacy

Where is my work saved? In your browser as you go — local projects live on your device. Cloud (shared) projects sync on explicit save. See Manage projects.

Will I lose my work if I close the tab? No. Local projects autosave on-device; nothing depends on you remembering to save. See Manage projects.

Can I export my diagrams? Yes — a full project JSON, or a document (PDF / Markdown) with your diagrams as SVG or PNG. See Export.

Sharing and pricing

Can I share a project with my team? Yes — promote a local project to the cloud and invite members. See Share & collaborate.

Is there a free tier? Yes. The full data round-trip — export, import, backup, restore — is free on every tier; paid tiers lift caps and add cross-project transfer. See your account.

Working with code

Can I generate diagrams from my codebase? Yes. Point the tool at a repository and it builds a model; re-running never silently discards manual curation. See Document from code.

I changed my code — how do I refresh the diagram? Use Update from code on the project's detail page. You review every add, edit, and removal before anything changes. See Document from code.

Something's not working

A screen is empty, an import looks off, or sign-in is stuck. Most of these have a one-line fix — see Troubleshooting.

Where next