# Sketchboard

> Draw diagrams, flowcharts, mind maps and floor plans on an endless board. Sketchboard is a drawing board for ideas: boxes, arrows that stay glued to their shapes, sticky notes, freehand pen and over a thousand props, in clean lines or a hand-drawn look. Libraries for flowcharts, UML and ER, networks, floor plans with walls, dimensions and a real-world scale, and mind maps with automatic layout. Import draw.io and Excalidraw files, export PNG, SVG and PDF, present frames as slides and share boards with your team.

Sketchboard (Diagrams, sketches and plans) is an app of usefulweb.app (https://usefulweb.app/): a full program that runs in the browser. Its engine is deterministic and the same functions are exposed as tools, so an agent can compute exactly what the app shows.

## Use it
- Landing page: https://sketchboard.usefulweb.app/
- Workspace (browser app): https://sketchboard.usefulweb.app/app - open a project with https://sketchboard.usefulweb.app/app#project=<base64url-encoded project JSON> or a template with https://sketchboard.usefulweb.app/app#template=<id>
- Project file format (JSON Schema): https://sketchboard.usefulweb.app/project.schema.json
- Tutorials: https://sketchboard.usefulweb.app/tutorials
- JSON API: POST https://sketchboard.usefulweb.app/api/v1/tools/<toolId>/calculate (catalog: https://sketchboard.usefulweb.app/api/v1/tools)
- OpenAPI: https://sketchboard.usefulweb.app/openapi.json
- MCP (Streamable HTTP): https://sketchboard.usefulweb.app/mcp

## Engine tools
- [Sketchboard draw.io to SVG](https://sketchboarddrawiotosvg.usefulweb.app/): Convert a draw.io (diagrams.net) or Excalidraw file into a clean SVG and an editable board. Part of [Sketchboard](https://sketchboard.usefulweb.app/) (ownerApp: sketchboard). API: POST https://sketchboard.usefulweb.app/api/v1/tools/sketchboard-drawio-to-svg/calculate · MCP tool `sketchboard_drawio_to_svg`
- [Sketchboard Mermaid to Diagram](https://sketchboardmermaidtodiagram.usefulweb.app/): Turn a Mermaid flowchart into a laid-out, editable diagram with an SVG export. Part of [Sketchboard](https://sketchboard.usefulweb.app/) (ownerApp: sketchboard). API: POST https://sketchboard.usefulweb.app/api/v1/tools/sketchboard-mermaid-to-diagram/calculate · MCP tool `sketchboard_mermaid_to_diagram`
- [Sketchboard Auto Layout](https://sketchboardautolayout.usefulweb.app/): Tidy up a diagram automatically: layered flowchart layout or a balanced mind map. Part of [Sketchboard](https://sketchboard.usefulweb.app/) (ownerApp: sketchboard). API: POST https://sketchboard.usefulweb.app/api/v1/tools/sketchboard-auto-layout/calculate · MCP tool `sketchboard_auto_layout`

## Formats
- Import: Sketchboard board (.sketchboard.json), draw.io / diagrams.net file (.drawio, .xml; plain or compressed pages), Excalidraw drawing (.excalidraw), Mermaid flowchart text, Share link (#board=)
- Export: Sketchboard board (.sketchboard.json), PNG image (1×–3×), SVG vector image (props embedded), PDF (true scale, A4/A3/Letter or one page per frame), Share link (#board=)

## Limits
- Live editing merges whole elements and their fields; two people typing into the same label at the same moment do not merge character by character.
- draw.io stencils beyond the common flowchart, UML and basic shapes are drawn as rectangles; images inside draw.io and Excalidraw files are not imported.
- Only the flowchart part of Mermaid is understood (no sequence, class or Gantt diagrams).
- Text sizes are estimated, so very long labels can wrap slightly differently in the PDF than on screen; rotated props are drawn upright in PDFs.
- Share links carry the whole board, so they get long for big boards; use a file or a workspace instead.
- Groups are one level deep; grouping groups makes one bigger group.