eraser-diagrams は何をしますか?
コード、インフラストラクチャ、または説明からアーキテクチャ図を生成します。ユーザーがシステムアーキテクチャの可視化、図式化、またはドキュメント化を求めたときに使用します。
コード、インフラストラクチャ、または説明からアーキテクチャ図を生成します。ユーザーがシステムアーキテクチャの可視化、図式化、またはドキュメント化を求めたときに使用します。
このスキルは、AIエージェント(Claude Code、Cursor、Codexなど)がユーザーのリクエストに応じて、コードベースやインフラストラクチャの定義、あるいは自然言語による説明からシステムアーキテクチャ図を自動生成する機能を提供します。開発者がシステム設計の文書化やレビュー、共有を行う際に、手動で図を作成する手間を省き、常に最新のコードや構成と同期した正確な図を生成します。主にEraser Diagramsプラットフォームを利用しており、Docker Composeファイルやクラウドリソースの定義からも図を生成できるため、マイクロサービスアーキテクチャやクラウドインフラの可視化に特に有効です。エージェントはユーザーの意図を理解し、適切な入力(コードスニペット、ファイルパス、説明文)から図を生成し、その結果をユーザーに提示します。
npx skills add https://github.com/eraserlabs/eraser-io/tree/main/skills/eraser-diagramsInstalled? Explore more 画像 skills: steipete/songsee, affaan-m/frontend-design, mattpocock/improve-codebase-architecture · View all 6 →
コード、インフラストラクチャ、または説明からアーキテクチャ図を生成します。ユーザーがシステムアーキテクチャの可視化、図式化、またはドキュメント化を求めたときに使用します。
Generate spectrograms and feature-panel visualizations from audio with the songsee CLI.
Create distinctive, production-grade frontend interfaces with high design quality. Use when the user asks to build web components, pages, or applications and the visual direction matters as much as the code quality.
Scan a codebase for deepening opportunities, present them as a visual HTML report, then grill through whichever one you pick.
Add documentation for a new AI provider — usage docs, env vars, Docker config, image resources.
Tests in real browsers via Chrome DevTools MCP. Use when building or debugging anything that runs in a browser. Use when you need to inspect the DOM, capture console errors, analyze network requests, profile performance, or verify visual output with real runtime data. Requires the chrome-devtools MCP server to be configured.
This skill should be used when the user wants to visualize data. It intelligently selects the most suitable chart type from 26 available options, extracts parameters based on detailed specifications, and generates a chart image using a JavaScript script.