tldraw-offline

Featured

Drive and script tldraw offline canvases with an agent.

AI & Automation 221,168 stars 42199 forks Updated today MIT

Install

View on GitHub

Quality Score: 93/100

Stars 20%
100
Recency 20%
100
Frontmatter 20%
70
Documentation 15%
100
Issue Health 10%
50
License 10%
100
Description 5%
100

Skill Content

# tldraw offline Skill Work with the tldraw offline desktop app (offline.tldraw.com): read the open canvas, make edits, and write **document scripts** — JavaScript embedded in a `.tldraw` file that runs on load and gives the file durable behavior. The app runs a **local HTTP API** (default `localhost:7236`) that a coding agent drives with plain `curl` from its terminal — this is exactly how the app's own homepage demo (Codex editing a canvas live) works. The agent does NOT use computer-use / GUI clicking, and does NOT hand-edit the `.tldraw` file directly. Keep tldraw offline open while you work. ## When to Use - The user has tldraw offline open and asks you to build or modify a canvas (diagrams, wireframes, layouts). - You want to add durable behavior to a drawing (reactive shapes, interactive buttons, animation, connection logic) via an embedded document script. Do NOT hand-place shapes to imitate a drawing — write the code that generates them. Agents are far better at scripting the canvas than at drawing on it. ## Prerequisites - **tldraw offline installed and running**, with a document open. Releases: https://github.com/tldraw/tldraw-offline/releases/latest (macOS DMG, Windows x64/Arm64, Linux `x86_64`/`arm64` AppImage or amd64/arm64 `.deb`). - **Agent skills installed in the app**: `Develop → Install Agent Skills`. The app writes its own tldraw skill into `~/.codex/skills/`, `~/.claude/skills/`, `~/.cursor/skills/`, and `~/.gemini/skills/` — teaching th...

Details

Author
NousResearch
Repository
NousResearch/hermes-agent
Created
1 years ago
Last Updated
today
Language
Python
License
MIT

Integrates with

Similar Skills

Semantically similar based on skill content — not just same category

Data & Documents Solid

tldraw-skill

Use when user requests diagrams, flowcharts, architecture charts, or visualizations. Also use proactively when explaining systems with 3+ components, complex data flows, or relationships that benefit from visual representation. Generates .tldr JSON files and exports to PNG/SVG locally using @kitschpatrol/tldraw-cli.

99 Updated 1 weeks ago
Agents365-ai
Web & Frontend Listed

atmos-canvas-agent

Drive the user's open Atmos Canvas via `atmos canvas` CLI: diagrams, layout, screenshots, local .atmos.tldr documents, and (when needed) durable document scripts or one-shot exec. Use for sketch/draw/diagram/layout requests, and for interactive surfaces or clickable UI only when the user asks for that behavior.

3 Updated today
AruNi-01
Data & Documents Featured

drawio-skill

Use when the user requests diagrams, flowcharts, architecture diagrams, ER diagrams, UML / sequence / class diagrams, SysML / MBSE diagrams (block definition, internal block, requirement, parametric), BPMN business process diagrams, swimlane / cross-functional flowcharts, network topology, cloud architecture from Terraform or Kubernetes manifests, ML/DL model figures (Transformer/CNN/LSTM), mind maps, or any visualization. Also use proactively when explaining systems with 3+ components, complex data flows, or relationships that benefit from visual representation. Best suited when the diagram needs custom styling, rich shape vocabulary, swimlanes, or exportable images (PNG/SVG/PDF/JPG). Generates .drawio XML and exports locally via the native draw.io desktop CLI.

6,696 Updated yesterday
Agents365-ai