# ExcaliClaw — full text > ExcaliClaw is an independent, collaborative workspace for hand-drawn diagrams, with a hosted MCP server for AI agents. Index of pages: https://excaliclaw.com/llms.txt --- ## Collaborative diagrams, drawn together in real time URL: https://excaliclaw.com/collaborative-diagrams ExcaliClaw is a workspace where a team can sketch the same diagram at the same time, see each other's cursors move, and still have every drawing saved and easy to find afterwards. ### How real-time collaboration works Open a drawing, share it with a teammate by username as a viewer or an editor, and they can open the same drawing in their browser. People with edit access draw on the same canvas at once and see each other's cursors live. Nothing to install and no manual saving: the drawing is stored automatically as you work. ### Share the way that fits the moment - By username, as a viewer (can look) or as an editor (can draw). You decide per drawing or per collection. - By public link, read-only: useful to send a diagram to someone who does not have an account. - Revoke access whenever you want: sharing is an instant grant, with no pending invitations to manage. ### It stays organized after the meeting A collaborative whiteboard is only useful if you can find the diagram again next week. Drawings live in collections (folders), you can search across all of them by name, and each drawing keeps a version history so you can go back to an earlier state. How long that history is kept depends on your plan: one day on Free, 30 days on Starter and unlimited on Pro. ### Bring an AI agent into the session Through MCP, an AI agent such as Claude or Cursor can read the live canvas of a drawing that people have open, and apply changes to it. That turns the assistant into one more participant: you sketch the rough idea, it tidies the layout or adds the missing boxes. ### Plans and limits You can start for free. Paid plans raise how many drawings you can have shared at once and how many people you can share with: Starter is built for small teams of up to 5 and Pro for teams of up to 20, with extra members available from Pro. MCP and AI are unlimited on every plan. --- ## A diagram organizer so you never lose a drawing again URL: https://excaliclaw.com/diagram-organizer Most whiteboards give you a blank canvas and nothing else. ExcaliClaw gives you the canvas and the place where every diagram you ever drew is saved, filed and searchable. ### The problem with loose sketches A diagram drawn in a tab that gets closed, or exported to a file nobody names properly, is a diagram you will redraw in three months. The point of an organizer is that the drawing is already saved, already named and already in the right folder when you need it again. ### What you get - Automatic saving: every drawing is stored as you draw, so a closed tab never costs you work. - Collections: folders to group drawings by project, client or team. Anything not filed yet waits in Unorganized. - Instant search: find a drawing by name across all your collections. - Version history: restore an earlier state of a drawing. Retention depends on the plan: one day on Free, 30 days on Starter, unlimited on Pro. - Sharing: give a teammate view or edit access by username, or send a read-only public link. ### Your data stays portable You can export everything to a JSON file as a backup, and import drawings from other tools, including boards from Miro. If you ever want to leave, your diagrams leave with you. ### Organize with an AI agent The same organization is available to AI agents through MCP: an agent can list your drawings and collections, create a new collection, and move a batch of drawings into it. Ask Claude to tidy a messy Unorganized folder and it can do it for you. --- ## A hosted MCP server so AI agents can draw diagrams for you URL: https://excaliclaw.com/ai-diagrams-mcp MCP, the Model Context Protocol, is an open standard that lets AI assistants use external tools. ExcaliClaw exposes its workspace as an MCP server, so an agent can create flowcharts, ER diagrams and notes directly in your account and hand you a link to open them. ### Connect in one line The server is remote and uses Streamable HTTP. Add this URL as an MCP server in your client: ``` https://excaliclaw.com/mcp ``` The first time, your client opens a browser so you sign in with your ExcaliClaw account through OAuth. There is no API key to copy or store. After that, the agent works on the drawings of that account. ### What an agent can do - Create diagrams: create_flow_diagram for flowcharts and architecture diagrams, create_er_diagram for entity-relationship diagrams, and add_sticky_note for notes. The server computes the layout, so shapes do not overlap. - Manage drawings: list_designs, get_design, create_design, update_design and delete_design. - Organize: list_collections, create_collection and move_designs_to_collection. - Export: export_design returns a PNG or SVG of a drawing, with a public URL if you want one. - Work live: get_live_scene, apply_live_scene_change and wait_for_scene_change let an agent see and edit a drawing that people have open right now. - Version history: list_design_versions and get_design_version let an agent see earlier states, including the one saved right before each of its own changes. - Reuse components: list_library_components, get_library_component and save_library_component for your own icon and shape library. ### Why a purpose-built tool beats raw shapes Asking a language model to place dozens of shapes by hand usually produces overlapping boxes and crossed lines. The diagram tools take nodes and edges, or entities and relationships, and the server does the geometry. The agent describes what the diagram means; ExcaliClaw draws it. ### Works with the clients you already use Claude Code, Claude Desktop and Claude.ai, Cursor, VS Code with GitHub Copilot Chat, Codex CLI, OpenCode and OpenClaw. Each one connects with the same URL and the same sign-in. ### Included in every plan MCP and AI usage are unlimited on every ExcaliClaw plan, including Free. --- ## Create diagrams with Claude using the ExcaliClaw MCP server URL: https://excaliclaw.com/integrations/claude Connect Claude to ExcaliClaw once and you can ask it, in plain language, to draw a flowchart, an ER diagram or an architecture diagram. Claude builds it in your workspace and replies with a link. ### Connect Claude Code Run this in your terminal, then follow the browser sign-in prompt: ``` claude mcp add excaliclaw --transport http https://excaliclaw.com/mcp claude "/mcp" # select "excaliclaw", then "Authenticate" ``` ### Connect Claude Desktop or Claude.ai 1. Go to Settings, then Connectors, then Add custom connector. 2. Paste https://excaliclaw.com/mcp and save. 3. Click Connect and log in with your ExcaliClaw account when prompted. Sign-in uses OAuth in your browser. You never paste an API key. ### Things to ask Claude - "Draw the login flow of this app as a flowchart and give me the link." - "Create an ER diagram for a bookshop with authors, books and orders." - "Add a pink sticky note that says 'check rate limits' to my API design drawing." - "List my drawings and move everything about billing into a new collection called Billing." - "Export my architecture drawing as an SVG." Claude can also work on a drawing you have open in the browser: it reads the live canvas and applies changes, so you can sketch and ask for a cleanup while you keep drawing. ### What happens behind the scenes Claude calls the tools of the ExcaliClaw MCP server, such as create_flow_diagram or create_er_diagram. The server lays out every shape and saves the drawing in your account, in the collection you choose. The result is a normal ExcaliClaw drawing you can edit, share and organize like any other. --- ## Draw diagrams from your code in Cursor with ExcaliClaw URL: https://excaliclaw.com/integrations/cursor Cursor already knows your codebase. Add the ExcaliClaw MCP server and it can turn that knowledge into a diagram you can open, edit and share, without leaving the editor. ### Add ExcaliClaw to Cursor 1. Open Cursor and go to Settings, then MCP, then Add new MCP server. 2. Paste this configuration: 3. Save, and sign in with your ExcaliClaw account when Cursor opens the browser. ``` { "url": "https://excaliclaw.com/mcp" } ``` Sign-in is OAuth, so there is no API key to manage. ### What to ask Cursor - "Diagram how a request moves through this repo, from the router to the database, and give me the link." - "Create an ER diagram of the tables defined in our migrations." - "Draw the architecture of this service with React, Redis and AWS icons." - "Add a sticky note to the architecture drawing listing what we still have to refactor." ### Why it fits a coding workflow Documentation diagrams go stale because redrawing them is tedious. When the assistant can read the code and draw in the same step, regenerating a diagram after a refactor costs one sentence. The diagram nodes can carry hand-drawn icons, and if you saved a component in your ExcaliClaw library, that exact shape is reused. ### Share and keep the result Every diagram Cursor creates is a normal drawing in your workspace: saved automatically, filed in a collection, searchable and shareable with your team by username or by a read-only link. --- ## Architecture and flow diagrams for engineering teams URL: https://excaliclaw.com/use-cases/engineering Engineering diagrams have three enemies: they get lost, they go stale, and they are tedious to draw. ExcaliClaw is built around fixing all three. ### One searchable place for every diagram System architecture, sequence sketches, incident timelines and database schemas all live in collections you can search by name. New teammates find the diagram instead of asking for it, and nothing depends on one person's laptop. ### Draw together while you design Share a drawing with the team as editors and design the change together on a call: everyone sees the live cursors and the same canvas. For people outside the team, a read-only public link is enough to review it. ### Generate diagrams from the code - Flow and architecture diagrams from nodes and edges, with optional hand-drawn icons for technologies such as React, Redis or AWS. - ER diagrams from your tables, fields and relationships, with primary and foreign keys marked. - Sticky notes for open questions and decisions, added by you or by the agent. Your AI assistant (Claude, Cursor, VS Code with Copilot Chat and others) does this through the MCP server, so a diagram can be regenerated after a refactor with a single request. Layout is computed on the server, so the result is readable without nudging shapes by hand. ### A shared component library Save the shapes your team reuses, such as a service box or a database cylinder, in your library. Agents can list and reuse those exact components, which keeps diagrams visually consistent. ### Export when you need it elsewhere Agents can export any drawing as PNG or SVG to paste into a pull request or a document, and you can back up your whole workspace as a JSON file at any time. --- ## How to make a flowchart, step by step URL: https://excaliclaw.com/guides/how-to-make-a-flowchart A flowchart shows how a process moves from start to finish. Done well, it makes a confusing process obvious in one glance. Here is how to build a clear one. ### The four symbols you need - Oval (terminator): where the process starts and ends. - Rectangle (process): an action or step, such as "Validate the form". - Diamond (decision): a question with two or more exits, usually yes and no. - Arrow (flow line): the direction from one step to the next. These four cover almost every flowchart. Add other symbols only when your audience already knows them. ### Step by step 1. Define the process and its boundaries: where does it start, and what counts as done? 2. List the steps in order, as short verb phrases. 3. Mark every point where the path can split and write it as a question. 4. Draw the start oval, then place each step below or to the right of the previous one. 5. Connect everything with arrows, and label the exits of each decision. 6. Check that every path reaches an end. Loose ends are the most common flaw. 7. Show it to someone who does not know the process and see if they can follow it unaided. ### Common mistakes - Too much detail in one chart: split big processes into a main chart and sub-flows. - Decisions without labelled exits, or with a single exit. - Arrows that cross each other. Rearrange the shapes until they do not. - Mixing directions. Pick top to bottom or left to right and keep it. - Vague steps such as "Handle it". Say what is actually done. ### Draw one online In ExcaliClaw the shapes you need are right there: rectangles, ellipses, diamonds and arrows, in a hand-drawn style that keeps a sketch feeling like a sketch. You can start in the free whiteboard without an account, and sign up when you want the drawing saved. If you prefer to describe it instead of drawing it, connect an AI assistant over MCP and ask it for a flowchart. The create_flow_diagram tool takes the steps and the connections, with box, ellipse and diamond shapes and labelled edges, and the server lays everything out without overlaps. --- ## How to make an ER diagram URL: https://excaliclaw.com/guides/er-diagram An entity-relationship (ER) diagram is a picture of the data your system stores and how the pieces relate. It is the usual first step before designing database tables. ### The building blocks - Entity: a thing you keep data about, such as Customer, Book or Order. Drawn as a box. - Attribute: a property of an entity, such as name, price or email. In Chen notation each attribute is an ellipse attached to its entity. - Primary key (PK): the attribute, or set of attributes, that uniquely identifies each record. - Foreign key (FK): an attribute that points to the primary key of another entity. - Relationship: how two entities are connected, such as Customer places Order. Drawn as a diamond in Chen notation. - Cardinality: how many of one side relate to the other: one to one (1:1), one to many (1:N) or many to many (N:M). ### Step by step 1. List the entities: the nouns your system has to remember. 2. Add the attributes each entity needs, and choose a primary key for each. 3. Find the relationships between entities, and name them with a verb. 4. Set the cardinality on both sides of every relationship. 5. Resolve many-to-many relationships with a linking entity that holds the two foreign keys. 6. Review for duplication: if a fact is stored in two places, one of them probably belongs in its own entity. ### A small example A bookshop has Author, Book and Order. An Author writes many Books (1:N). A Book appears in many Orders and an Order contains many Books (N:M), so you add an OrderItem entity between them with the keys of both. Book has attributes isbn (PK), title and price; Order has id (PK), date and the customer reference. ### Notations Chen notation, with boxes, attribute ellipses and relationship diamonds, is the classic teaching format and shows every attribute explicitly. Crow's foot notation is common in tools for database design and puts the attributes inside the entity box. ExcaliClaw draws Chen notation. ### Draw one in ExcaliClaw You can draw it by hand on the canvas, or describe it to an AI assistant connected over MCP. The create_er_diagram tool takes your entities with their fields, mark primary and foreign keys, and your relationships with a label and cardinalities such as 1, N or 0..1. The server computes every position, so ellipses and lines do not collide.