ai-agent

AsciiCanvas: AI-Readable Diagrams

Name: AsciiCanvas: AI-Readable Diagrams
Author: Sayhi-bzb

Build diagrams AI can understand with AsciiCanvas, a tool for startup founders working with LLMs.

334 stars6 forksTypeScriptGuide quality 9/10Updated 9/4/2026100% free · open source

What it does

AsciiCanvas allows startup founders to build diagrams that can be understood by Large Language Models (LLMs) using a native visual interface with infinite canvas and multi-byte support

When to use it

•When designing architecture for an AI-powered project
•When creating flowcharts for automated workflows
•When visualizing data structures for machine learning models

Ready-to-paste prompt

Create a diagram for a simple e-commerce workflow using 'cart -> payment -> order confirmation' and paste it into your LLM for processing

Heads up: Ensure you have Git installed on your system to clone the repository, and be aware that the tool requires a compatible TypeScript environment to run

Saves to your device

Use with Claude

New

Skip the builder — one click puts this in Claude, Cursor, Antigravity and more.

✅ Light setup

Installs with a command or two; your AI agent can do it for you.

Try it instantly — no install

Claude Code

mkdir -p ~/.claude/skills/asciicanvas && curl -fsSL https://workflowstacks.com/api/skills/asciicanvas/claude-skill -o ~/.claude/skills/asciicanvas/SKILL.md

Open in another AI app

Opens the app with this repo with the prompt ready to go — no copy-paste needed.

Connect the whole catalog (MCP)

claude mcp add --transport http workflowstacks https://workflowstacks.com/api/mcp

Adds a WorkflowStacks connector to Claude Code: search and load any skill here by chatting.

What's inside — free to inspect

No purchase needed

Read the entire source before you build — unlike paid marketplaces that hide it behind a buy button.

top-level files

folders

81.7M

source size

MIT

license

Key files

AGENTS.md

eslint.config.js

index.html

package.json

playwright.config.ts

README.md

File tree

.agents/

.claude/

.github/

apps/

demo/

deploy/

e2e/

exp/

packages/

public/

scripts/

src/

.dockerignore

.gitignore

.prettierignore

.prettierrc

.release-please-manifest.json

AGENTS.md

CLAUDE.md

components.json

DESIGN.md

eslint.config.js

index.html

knip.json

Use with Claude

New

Skip the builder — one click puts this in Claude, Cursor, Antigravity and more.

✅ Light setup

Installs with a command or two; your AI agent can do it for you.

Try it instantly — no install

Claude Code

mkdir -p ~/.claude/skills/asciicanvas && curl -fsSL https://workflowstacks.com/api/skills/asciicanvas/claude-skill -o ~/.claude/skills/asciicanvas/SKILL.md

Open in another AI app

Opens the app with this repo with the prompt ready to go — no copy-paste needed.

Connect the whole catalog (MCP)

claude mcp add --transport http workflowstacks https://workflowstacks.com/api/mcp

Adds a WorkflowStacks connector to Claude Code: search and load any skill here by chatting.

Quick Actions

Details

Creator

Sayhi-bzb

Language

TypeScript