Claude CodeやCodex、Cursorなどのエージェントに導入する図表作成スキル。45種類の図表を、Mermaidを使わず自己完結した1つのHTML+SVGファイルとして出力する。
diagram-designと一緒に検討されているサービス
AIで
エディタのAIを使いこなしたい人向けの講座と、コードなしで作れるツールです。
初月10ドルオフ（新規ユーザー）
Claude CodeやCursorへの指示を声で入力できる。日本語にも対応し、Mac・Windowsのどの入力欄でも使える（無料は1,000語まで）
AI音声・文字起こし ／ 最低料金 ¥0〜
diagram-designとは、Claude CodeやCodex、Cursorなどのエージェントに導入する図表作成スキルです。無料で利用できます。AI PICKS編集部のスコアは3.47/5.00（AIコーディング338本中189位）です。
| 提供元 | github.com | カテゴリ | AIコーディング（189位） |
|---|---|---|---|
| 料金タイプ | 無料 | 無料枠 | すべて無料 |
| 日本語 | 未確認 | 対応環境 | CLI |
| 主な機能 | ダイアグラム／SVG／開発ツール／オープンソース | ||
| 法人利用 | 個人・法人どちらも | 公式サイト | github.com ↗ |
diagram-designは、Claude CodeやCodex、GitHub Copilotなどのコーディングアシスタントに対応した図表作成スキルです。アーキテクチャ図やシーケンス図、ER図、ガントチャートなど42種類の図表仕様を収録しています。Mermaid構文に依存せず、装飾的な影を排した単一のHTMLとSVGコードを直接出力する設計を採用しています。外部レンダラーの導入なしで完結する図表を、コーディングエージェントの操作から作成したい開発者に向いています。
diagram-designの料金改定をメールで受け取る
公式ページで検証した改定だけを通知します。
AI PICKS編集部は、注目ツールの料金変動を月次でモニタリングしています。diagram-designは現在、月次モニタリングの対象に含まれていません。 最新の料金は公式サイトでご確認ください。
AI PICKS編集部運営: 株式会社エーアイピックス編集部評価 ・ 2026年10月7日 更新diagram-designの強みは、アーキテクチャ図やシーケンス図、ガントチャートなど42種類の図を、ブラウザで直接開ける単一のHTMLとSVGで出力できる点です。各図はライトとダークのミニマル版と編集デザイン版で出力され、ビルドやJavaScriptは要りません。draw.ioやMermaidで作った既存の図を描き直させることもできます。一方でClaude CodeやCodexなど対応するエージェント上で動くスキルなので、単体では使えません。Mermaid構文のようなテキスト形式で図を残したい用途にも合いません。ブログや資料に載せる図を、エージェントへの指示だけで見栄えよく揃えたい人に向きます。
向いている
向いていない
diagram-designの強みは、アーキテクチャ図やシーケンス図、ガントチャートなど42種類の図を、ブラウザで直接開ける単一のHTMLとSVGで出力できる点です。各図はライトとダークのミニマル版と編集デザイン版で出力され、ビルドやJavaScriptは要りません。
編集部レビューの全文 ＞編集部が確認した良い点
気になる点
利用者の口コミはまだありません。最初の 1 件を書きませんか
「何に使ったか」「良かった点」「困った点」の 3 つで 100 字程度。匿名で投稿できます。
編集部の記述は公式情報・公開情報に基づくもので、利用者の口コミではありません。評価方針
投稿いただいた口コミは、編集部が事実誤認・誹謗中傷・個人情報をチェック後に公開します。匿名投稿可、投稿後の編集不可です。
あなたの
料金や仕様は変わるため、確認した日付と一緒に出典としてリンクしていただけると読者が最新情報にたどり着けます。
出典: AI PICKS「diagram-designの料金・評判」（2026-10-06 時点） https://aipicks.jp/tool/diagram-design
diagram-designはAI PICKS編集部が独自スコアで評価し、3.47 / 5.00のスコアを付けています。 編集部スコアと部門順位に応じて CATEGORY LEADER・EDITOR'S CHOICE などの称号バッジを取得でき、公式サイトに掲載すると第三者評価として信頼性を訴求できます（無料・自動更新）。
<a href="https://aipicks.jp/tool/diagram-design?utm_source=badge&utm_medium=referral" target="_blank" rel="noopener">
<img src="https://aipicks.jp/api/badge?slug=diagram-design" alt="AI PICKS 認定バッジ｜diagram-design" width="200" height="236" loading="lazy" />
</a>このコードを公式サイトに貼ると、AI PICKSの認定バッジが表示されます。称号・時期は編集部スコアと部門順位から自動で最新化され、貼り替えは不要です。掲載は無料です。
OpenCodeOpenCodeは、ターミナル・IDE・デスクトップで使えるオープンソースのAIコーディングエージェントです。Claude、GPT、Geminiのほかローカルモデルまで75以上のプロバイダーに接続でき、GitHub CopilotやChatGPT Plus/Proのアカウントもそのまま使えます。本体は無料で、MITライセンスで公開されています。
TraeTraeは、自律開発エージェント「SOLO」やマルチエージェントを搭載したAI開発ツールです。VS Code系の操作感を持つ「TraeCode」と業務支援の「TraeWork」で構成されます。要件定義からデプロイまで自律実行するSOLOモードと通常エディタを切り替え、実装を効率化したいエンジニアに向いています。
WarpWarpは、ソフトウェア開発ライフサイクル（SDLC）全般を自動化する開発プラットフォームです。エージェント群を実行するWarp Factories、端末を選ばず動くWarp Agent CLI、AI協調型のWarp Terminalを提供し、コードレビューやバグ調査、変更検証を自動化します。
Google AI StudioGeminiモデルをブラウザ上で試作・検証し、プロンプト作成、マルチモーダル入力、APIキー発行まで進められる開発者向けAI実験環境です。