Professional email management, deliverability optimization, and marketing strategy powered by Claude Code.
6 skills4 agents2 hooks+2+1132
@agricidanielContent
Plugin
claude-canvas
Creates and lays out Obsidian Canvas files as presentations, flowcharts, mind maps, mood boards, and knowledge graphs. It can also fill canvases with images, notes, and diagrams, generate content with AI, and export the results to PNG, SVG, or PDF.
Plugin Signal51/100Fair
maintained20
capable55
documented100
adopted53
Claude Code
$ npx -y skills add AgriciDaniel/claude-canvas --agent claude-code
Codex
$ npx skills add AgriciDaniel/claude-canvas -a codex
Cursor
$ npx skills add AgriciDaniel/claude-canvas -a cursor
Gemini CLI
$ npx skills add AgriciDaniel/claude-canvas -a gemini-cli
GitHub Copilot
$ npx skills add AgriciDaniel/claude-canvas -a github-copilot
OpenCode
$ npx skills add AgriciDaniel/claude-canvas -a opencode
Windsurf
$ npx skills add AgriciDaniel/claude-canvas -a windsurf
What's inside
8 Skills
/canvas-createCreate new Obsidian Canvas files — blank with a starter structure, or from one of 12 template archetypes (presentation, flowchart, mind-map, gallery, dashboard, storyboard, knowledge-graph, mood-board, timeline, comparison, kanban, project-brief). Handles directory creation,/canvas-exportExport Obsidian Canvas files to PNG, SVG, or PDF formats. Uses the Advanced Canvas plugin's built-in export when Obsidian is running, or falls back to Playwright browser-based screenshot capture. Supports single canvas export, presentation slide-per-page PDF export, and batch
3 Agents
canvas-composerContent strategist for canvas text nodes. Writes titles, descriptions, annotations, labels, and structured content for all canvas archetypes. Follows the 15-30 visible nodes per viewport principle. Content is scannable: headers, bullets, bold. Max 200 words per text node.canvas-layoutSpatial positioning specialist for Obsidian Canvas. Computes optimal node positions using layout algorithms (dagre, grid, radial, force-directed, linear). Preserves zone containment, snaps to 20px grid, refits groups. Dispatched for complex canvases with 30+ nodes requiringcanvas-mediaMedia asset dispatcher for canvas generation. Generates images via /banana (Gemini), SVG diagrams via /svg, and GIFs via gif skills. Returns file paths for placement on canvas. Handles batch generation for multi-image canvases. <example>Context: /canvas generate needs 4 AI
README
claude-canvas
AI-orchestrated visual production for Obsidian Canvas. Create presentations, flowcharts, mood boards, knowledge graphs, and galleries with intelligent layout and AI-generated content.
Claude acts as Creative Director — describe what you want and get a fully populated, professionally laid-out canvas.
What It Does
- Create canvases from 12 built-in templates (presentation, flowchart, mind map, gallery, dashboard, storyboard, knowledge graph, mood board, timeline, comparison, kanban, project brief)
- Populate with images, text, PDFs, wiki notes, web links, Mermaid diagrams, SVGs, GIFs
- Layout with 6 algorithms (dagre, grid, radial, force-directed, linear, auto-detect)
- Present with Advanced Canvas plugin support (1200x675 slide groups with edge navigation)
- Generate entire canvases from a single description using AI-generated images and content
- Export to PNG, SVG, or PDF
Install
Claude Code CLI
claude plugin install AgriciDaniel/claude-canvas
Clone
git clone https://github.com/AgriciDaniel/claude-canvas.git ~/Desktop/claude-canvas
Add to existing project
claude plugin add ~/Desktop/claude-canvas
Commands
| You say | Claude does |
|---|---|
/canvas | List canvases with node counts and zones |
/canvas create my-board | Create a new blank canvas |
/canvas create launch from presentation | Create from template archetype |
/canvas add image photo.png | Add image node with auto aspect ratio |
/canvas add text "# Title" | Add markdown text card |
/canvas add banana "hero shot" | Generate AI image via /banana, add to canvas |
/canvas add mermaid "graph LR..." | Add Mermaid diagram (renders natively) |
/canvas zone "Research" 5 | Create a cyan-colored zone |
/canvas connect node-a node-b | Add edge between nodes |
/canvas from banana | Import recent AI-generated images |
/canvas layout dagre | Re-layout with hierarchical algorithm |
/canvas layout auto | Auto-detect best algorithm |
/canvas present "Q3 Review" | Build presentation canvas |
/canvas generate "mood board for cyberpunk game" | Full AI-orchestrated generation |
/canvas template list | Browse 12 archetypes |
/canvas export png | Export canvas to PNG |
Templates
| Archetype | Layout | Use Case |
|---|---|---|
presentation | Linear vertical | Slide decks for Advanced Canvas |
flowchart | Sugiyama/dagre | Process documentation |
mind-map | Radial center-out | Idea exploration |
gallery | Grid | Image showcases |
dashboard | Grid variable | Project status boards |
storyboard | Linear horizontal | Video/animation planning |
knowledge-graph | Force-directed | Entity relationships |
mood-board | Asymmetric grid | Creative direction |
timeline | Linear horizontal | Event sequences |
comparison | Two columns | Side-by-side analysis |
kanban | Column zones | Task management |
project-brief | Stacked zones | Project kickoff |
Canvas Location
claude-canvas is vault-aware but not vault-dependent:
- If
wiki/canvases/exists (claude-obsidian vault): uses that directory - Otherwise: creates
.canvases/in your current project
Integration
Works with these skills when installed (gracefully degrades if not available):
/banana— AI image generation via Gemini/svg— Diagram, chart, icon, and pattern generation/claude-gif-*— GIF generation, editing, and optimizationmcpvaultMCP — Read wiki notes for presentation content
Requirements
- Obsidian with Canvas support (v1.1+)
- Advanced Canvas plugin (recommended for presentations and export)
- Python 3.10+ (for layout and validation scripts)
File Structure
.claude-plugin/plugin.json Plugin metadata
commands/canvas.md CLI entry point
hooks/hooks.json PostToolUse auto-validation
skills/
canvas/ Main orchestrator — routes to sub-skills
SKILL.md
references/ 7 reference files (spec, layout, performance, templates, presentation, mermaid, media)
canvas-create/SKILL.md Create canvases
canvas-populate/SKILL.md Add nodes, edges, zones
canvas-layout/SKILL.md Re-layout algorithms
canvas-present/SKILL.md Presentation builder
canvas-generate/SKILL.md AI-orchestrated generation (flagship)
canvas-template/SKILL.md Template browser
canvas-export/SKILL.md Export to image/PDF
agents/ 3 agents (layout, media, composer)
scripts/ Python CLI tools (validate, layout, template)
templates/ 12 JSON Canvas archetypes
bin/setup.sh Install optional Python dependencies
Screenshots
Full Feature Showcase
AI images, SVG architecture diagram, Mermaid charts, callouts, and zones — all in one canvas
AI Image Gallery
8 diverse AI-generated images arranged in an auto-laid-out gallery zone
Presentation Mode
6-slide deck with real content, Mermaid diagrams, and edge navigation for Advanced Canvas
Mind Map (Radial Layout)
Auto-applied radial layout expanding from central topic
Comparison Template
Side-by-side option zones with criteria comparison section
Project Brief
Stacked zones: header, objectives with KPIs, and deliverables
Origin
claude-canvas originated from the /canvas skill in claude-obsidian — a knowledge companion for Obsidian vaults. The original skill handles wiki-scoped visual boards. claude-canvas extends this into a full visual production system for any project.
Attribution
Built by AgriciDaniel. Canvas format follows the JSON Canvas 1.0 open standard by the Obsidian team.
Author
Built by Agrici Daniel - AI Workflow Architect.
- Blog - Deep dives on AI marketing automation
- AI Marketing Hub - Free community, 2,800+ members
- YouTube - Tutorials and demos
- All open-source tools
Stars on GitHub
Momentum
- stars in total
- 306
File tree
More plugins by @agricidaniel.
View @agricidaniel’s profile@agricidanielclaude-ads
Audits paid ad accounts across platforms such as Google, Meta, Amazon, and Apple, plus budget planning and attribution checks. Built for agencies, consultants, and in-house marketing teams using Claude Code.
33 skills25 agents11k
@agricidanielclaude-seo
An open-source SEO analysis plugin for Claude Code covering technical SEO, content quality, Schema.org markup, AI search optimization, local SEO and e-commerce, with specialist skills for keyword data, backlinks, image generation and site crawling.
33 skills20 agents1 hook+2+1+128k
@agricidanielSimilar plugins.
promptschat
Gives Claude Code access to the prompts.chat library, letting you search, retrieve and improve AI prompt templates, and find and install Agent Skills from its registry.
2 skills2 agents2 commands1 MCP+3+2+2+2+1+1+1+1175k
@gh-fppt-master
A Claude Code skill for generating editable PPTX presentations and slides from a workflow, with reusable brand, style, layout, and deck workspaces, native charts, speaker notes, and template filling.
1 skill75k
@hugohe3officecli
Gives AI agents control over Word, Excel and PowerPoint files, with skills for building .docx reports, academic papers, Excel dashboards and Morph-style animated slides.
11 skills33k
@iofficeaifrontend-slides
A skill that builds animation-rich HTML presentations from scratch or converts PowerPoint files to web slides. Useful for anyone turning a deck into a web presentation.
1 skill32k
@zarazhangruiQuestions about claude-canvas.
Install it with the command on its page. It includes canvas-create, canvas-export, canvas-generate. Its skills do not fire on their own yet. Free and open source.
- What is claude-canvas?
- agricidaniel/claude-canvas is a plugin for AI-orchestrated visual production in Obsidian Canvas, with skills, agents, commands and hooks. Use it to generate or lay out presentations, flowcharts, mood boards and knowledge graphs, and to export finished canvases to PNG, SVG or PDF.
- How do I install claude-canvas?
- Run these in Claude Code: npx -y skills add AgriciDaniel/claude-canvas --agent claude-code. Then prompt normally.
- Does claude-canvas auto-invoke its skills?
- Not yet. It is indexed on Flowy as a plain plugin.
- Is claude-canvas free?
- Yes. Flowy is free and open source, with nothing gated. You can read every skill in full before you install.
- Which coding agents can use claude-canvas's skills?
- claude-canvas installs in Claude Code, and its skills also install in Codex, Cursor, Gemini CLI, GitHub Copilot, OpenCode and Windsurf with the skills CLI. Each skill's page has the install command. Flowy's auto-invocation, which fires a skill when your prompt matches, runs in Claude Code only.
Is this plugin yours?
Claim it with GitHubSubmit a pluginPromote it