beautiful-mermaid ライブラリを使って、美しい Mermaid 図を SVG または ASCII アートとしてレンダリングします。15 以上のテーマ、5 種類の図（フローチャート、シーケンス、状態、クラス、ER）をサポートし、超高速レンダリングを実現します。
このスキルは、`beautiful-mermaid` ライブラリを活用して、Mermaid 図を高品質な SVG または ASCII アートとしてレンダリングするためのものです。15 以上のテーマから選択でき、フローチャート、シーケンス図、状態図、クラス図、ER 図の 5 種類の図タイプに対応しています。ユーザーが「Mermaid 図をレンダリングして」「フローチャートを作成して」「テーマを適用して」「図を美しくして」といったリクエストをした場合や、`.mmd` ファイルが提供された場合に自動的に呼び出されます。また、複数の図を一括処理したり、ターミナルに適した ASCII 図を生成することも可能です。アーキテクチャの可視化、ワークフロー図、データモデルの表現など、幅広いユースケースに対応し、視覚的に美しく、かつ高速なレンダリングを実現します。対応プラットフォームは Claude Code、Cursor、Codex などを想定しています。
npx skills add https://github.com/imxv/pretty-mermaid-skills/tree/main/skills/pretty-mermaidInstalled? Explore more 画像 skills: steipete/songsee, affaan-m/frontend-design, mattpocock/improve-codebase-architecture · View all 6 →
beautiful-mermaid ライブラリを使用して、美しい Mermaid 図を SVG または ASCII アートとしてレンダリングします。15 以上のテーマ、5 種類の図タイプ（フローチャート、シーケンス、状態、クラス、ER）をサポートし、超高速レンダリングを実現します。このスキルは以下の場合に使用します: 1. ユーザーが「Mermaid 図をレンダリングして」と依頼したり、.mmd ファイルを提供した場合 2. ユーザーが「フローチャート/シーケンス図/状態図を作成して」とリクエストした場合 3. ユーザーが「テーマを適用して」または「図を美しくして」と希望した場合 4. ユーザーが「複数の図を一括処理する」必要がある場合 5. ユーザーが「ASCII 図」または「ターミナル対応図」に言及した場合 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.