Skip to content
mcp/skillhub

Agent Skill

Draw Io skill

draw-iosoftaworks/agent-toolkitskills/draw-io/SKILL.md

draw.io diagram creation, editing, and review. Use for .drawio XML editing, PNG conversion, layout adjustment, and AWS icon usage.

2.6kMIT

always on

33 tokname + description

once used

1,993 tokSKILL.md body

bundled files

52 scripts

repo stars

2.6kGitHub

Install the Draw Io skill

Skills CLI (Claude Code, Codex, Cursor and others)

npx skills add https://github.com/softaworks/agent-toolkit --skill draw-io

Claude Code, by hand (all projects)

git clone --depth 1 https://github.com/softaworks/agent-toolkit.git /tmp/agent-toolkit
mkdir -p ~/.claude/skills
cp -R /tmp/agent-toolkit/skills/draw-io ~/.claude/skills/draw-io

For one project only, copy the folder into .claude/skills/ in that project instead. The agent picks it up when a task matches its description.

What it costs your context

Agent Skills load in three steps. Tokens counted with the o200k tokenizer; your model's count will differ a little.

WhenWhat loadsCost
Every sessionName and description33 tok
When the agent uses itThe SKILL.md instructions1,993 tok
Only if opened5 bundled files (40 KB)varies

Until it is used, draw-io costs about 41× less than the median MCP server we measured (1,363 tokens on every turn). Installing all 43 skills from softaworks/agent-toolkit would load 2,462 tokens of descriptions. Skills vs MCP study

Checks

  • Ships scripts the agent can run. Read them before installing.

Checked 2026-10-22 · method

What's inside

The headings of its SKILL.md. Read the full file on GitHub.

  • draw.io Diagram Skill
  • 1. Basic Rules
  • 2. Font Settings
  • 3. Conversion Commands
  • 4. Layout Adjustment
  • 4.1. Coordinate Adjustment Steps
  • 4.2. Coordinate Calculation
  • 5. Design Principles
  • 5.1. Basic Principles
  • 5.2. Element Rules
  • 5.3. Accessibility
  • 5.4. Progressive Disclosure
  • 5.5. Metadata
  • 6. Best Practices
  • 6.1. Background Color
  • 6.2. Font Size
  • 6.3. Japanese Text Width
  • 6.4. Arrow Placement
  • 6.5. Arrow Connection to Text Labels
  • 6.6. edgeLabel Offset Adjustment
  • 6.7. Remove Unnecessary Elements
  • 6.8. Labels and Headings
  • 6.9. Background Frame and Internal Element Placement
  • 7. Reference

More skills from softaworks/agent-toolkit

All skills in this repo
  1. agent-md-refactorsoftaworks/agent-toolkit

    Refactor bloated AGENTS.md, CLAUDE.md, or similar agent instruction files to follow progressive disclosure principles. Splits monolithic files into organized, linked documentation.

    2.6k40 tok idle · 1,732 in use
  2. backend-to-frontend-handoff-docssoftaworks/agent-toolkit

    Create API handoff documentation for frontend developers. Use when backend work is complete and needs to be documented for frontend integration, or user says 'create handoff', 'document API', 'frontend handoff', or 'API documentation'.

    2.6k55 tok idle · 1,139 in use
  3. c4-architecturesoftaworks/agent-toolkit

    Generate architecture documentation using C4 model Mermaid diagrams. Use when asked to create architecture diagrams, document system architecture, visualize software structure, create C4 diagrams, or generate context/container/component/deployment diagrams. Triggers include "architecture diagram", "C4 diagram", "system context", "container diagram", "component diagram", "deployment diagram", "document architecture", "visualize architecture".

    2.6k82 tok idle · 2,505 in use
  4. codexsoftaworks/agent-toolkit

    Use when the user asks to run Codex CLI (codex exec, codex resume) or references OpenAI Codex for code analysis, refactoring, or automated editing. Uses GPT-5.2 by default for state-of-the-art software engineering.

    2.6k55 tok idle · 1,275 in use
  5. command-creatorsoftaworks/agent-toolkit

    This skill should be used when creating a Claude Code slash command. Use when users ask to "create a command", "make a slash command", "add a command", or want to document a workflow as a reusable command. Essential for creating optimized, agent-executable slash commands with proper structure and best practices.

    2.6k66 tok idle · 1,492 in use
  6. commit-worksoftaworks/agent-toolkit

    Create high-quality git commits: review/stage intended changes, split into logical commits, and write clear commit messages (including Conventional Commits). Use when the user asks to commit, craft a commit message, stage changes, or split work into multiple commits.

    2.6k54 tok idle · 522 in use
  7. crafting-effective-readmessoftaworks/agent-toolkit

    Use when writing or improving README files. Not all READMEs are the same — provides templates and guidance matched to your audience and project type.

    2.6k35 tok idle · 589 in use
  8. daily-meeting-updatesoftaworks/agent-toolkit

    Interactive daily standup/meeting update generator. Use when user says 'daily', 'standup', 'scrum update', 'status update', 'what did I do yesterday', 'prepare for meeting', 'morning update', or 'team sync'. Pulls activity from GitHub, Jira, and Claude Code session history. Conducts 4-question interview (yesterday, today, blockers, discussion topics) and generates formatted Markdown update.

    2.6k194 tok idle · 2,779 in use