Frontend Design

canvas-design

Generate technical diagrams, architecture charts, and visual assets from natural language. Outputs PNG/PDF — no third-party diagramming tools needed.

Install

npx skills add anthropics/skills@canvas-design -y -g

Cross-tool: Claude Code ~/.claude/skills/ · Qoder ~/.qoder/skills/ · TRAE ~/.trae/skills/

Generate technical diagrams, system architecture charts, and promotional assets from natural language. Outputs PNG/PDF.

Example Prompts

Generate a user checkout flow diagram, clean and professional style

Draw a microservices architecture with API gateway, user service, order service, message queue

Tech doc illustrations, PRD flow diagrams, team presentation architecture charts, marketing assets. No Figma or draw.io needed.

#diagrams#architecture#charts#PNG