codex-tldraw
A Codex stdio MCP server that generates simple tldraw product workflow diagrams as .tldr files.
README
codex-tldraw-mcp
A Codex stdio MCP server that generates simple tldraw product workflow diagrams as .tldr files.
This project is snapshot-only. It does not control a live browser canvas or provide live collaboration. It writes board files to the repository being diagrammed so a tldraw-compatible viewer can open them later.
Add To Codex
codex mcp add codex-tldraw -- npx -y codex-tldraw-mcp
Then ask Codex to use codex-tldraw and call diagram_repo.
Example prompt:
Use codex-tldraw to diagram this repo.
For manual Codex stdio MCP configuration:
[mcp_servers.codex-tldraw]
command = "npx"
args = ["-y", "codex-tldraw-mcp"]
What It Does
- Scans a local repo from package metadata and source text.
- Infers a simple user-facing product workflow.
- Draws that workflow as tldraw steps and arrows.
- Appends a new diagram to the right when the board already contains shapes.
- Exposes board summaries as MCP resources.
Output
The default board is:
<repo>/boards/main.tldr
If main.tldr is empty or missing, diagram_repo creates the first diagram near the canvas origin. If it already has shapes, diagram_repo appends the next diagram to the right of the existing content instead of clearing the board.
Tools
diagram_repo: scans a repo and appends a product workflow diagram to<repo>/boards/<boardName>.tldr.list_boards: lists boards under a repo'sboards/directory.read_board_summary: summarizes generated diagrams and shape counts.
Each tool accepts an optional repoPath. Relative paths are resolved from the MCP server working directory.
Board resources list and read boards from the most recent repoPath used by a tool call. Before any tool call, resources default to the MCP server working directory.
Security
This is a local filesystem tool. It reads source files from repoPath and writes .tldr files under repoPath/boards.
To restrict access to specific directories, set TLDRAW_MCP_ALLOWED_ROOTS to a path-delimited allowlist:
[mcp_servers.codex-tldraw]
command = "npx"
args = ["-y", "codex-tldraw-mcp"]
env = { TLDRAW_MCP_ALLOWED_ROOTS = "/Users/me/dev:/Users/me/work" }
When the allowlist is set, repoPath must resolve inside one of those roots.
Generated .tldr files do not store absolute local repository paths in shape metadata.
Local Development
This repo uses Bun for development:
bun install
bun run build
bun run smoke
Run the server from source:
bun run dev
Use a local build in Codex:
[mcp_servers.codex-tldraw]
command = "node"
args = ["/absolute/path/to/codex-tldraw-mcp/dist/index.js"]
Publish
Build, test, inspect the package contents, then publish:
bun install
bun run build
bun run smoke
bun publish --dry-run
bun publish --access public
For a handwriting font app, the workflow may be inferred as:
User writes alphabet on paper -> User takes a photo of the paper -> User uploads the image -> AI generates a font -> User downloads a .ttf file
Recommended Servers
playwright-mcp
A Model Context Protocol server that enables LLMs to interact with web pages through structured accessibility snapshots without requiring vision models or screenshots.
Magic Component Platform (MCP)
An AI-powered tool that generates modern UI components from natural language descriptions, integrating with popular IDEs to streamline UI development workflow.
Audiense Insights MCP Server
Enables interaction with Audiense Insights accounts via the Model Context Protocol, facilitating the extraction and analysis of marketing insights and audience data including demographics, behavior, and influencer engagement.
VeyraX MCP
Single MCP tool to connect all your favorite tools: Gmail, Calendar and 40 more.
graphlit-mcp-server
The Model Context Protocol (MCP) Server enables integration between MCP clients and the Graphlit service. Ingest anything from Slack to Gmail to podcast feeds, in addition to web crawling, into a Graphlit project - and then retrieve relevant contents from the MCP client.
Kagi MCP Server
An MCP server that integrates Kagi search capabilities with Claude AI, enabling Claude to perform real-time web searches when answering questions that require up-to-date information.
E2B
Using MCP to run code via e2b.
Neon Database
MCP server for interacting with Neon Management API and databases
Exa Search
A Model Context Protocol (MCP) server lets AI assistants like Claude use the Exa AI Search API for web searches. This setup allows AI models to get real-time web information in a safe and controlled way.
Qdrant Server
This repository is an example of how to create a MCP server for Qdrant, a vector search engine.