Svg

baoyu-infographicは、21種類のレイアウトと20種類のスタイルに対応した、構造化インフォグラフィック作成用のプロンプトフレームワークです。元になる内容を分析し、適切なレイアウトやスタイルを選び、UIデザイン、比較、ワークフロー、そのほか情報量の多い解説向けに、わかりやすいビジュアル要約を生成するのに役立ちます。

diagram-generator は、構造化入力から draw.io、Mermaid、Excalidraw の図を作成・編集するのに役立ちます。フローチャート、シーケンス図、クラス図、ER 図、マインドマップ、アーキテクチャ図、ネットワークトポロジーに対応し、既存の .drawio、.mmd、Excalidraw ファイルも読み取れるため、更新作業をスムーズに進められます。

gsap-plugins は、フロントエンド開発者が GSAP プラグインを正しく選び、導入し、使いこなすためのスキルです。プラグインの登録方法、import の書き方、そして ScrollToPlugin、ScrollSmoother、Flip、Draggable、Inertia、Observer、SplitText、ScrambleText、SVG 系プラグイン、イージングツール、GSDevTools まで、実践的にカバーします。汎用的なアニメーション解説ではなく、gsap-plugins に絞った明確なガイドが必要なときに役立ちます。

snipgrapherは、ソースコードを整ったシンタックスハイライト付きのPNG、SVG、WebPスニペット画像に変換します。再利用しやすいテーマ、プロファイル、CLIベースのレンダリングを備えており、ドキュメント、変更履歴、SNS投稿、snipgrapherによるUIデザイン向けに、見た目のそろったアセットが必要なときに最適です。install、config、batch、watchの各ワークフローに対応しているため、繰り返し使う用途でも安定した出力を得られます。

fireworks-tech-graphは、システム説明を本番投入可能なSVGおよびPNGの図に変換するためのdiagramming skillです。インストール手順、補助スクリプト、検証、テンプレート、スタイル参照を備えており、技術図、アーキテクチャのフローチャート、シーケンス図、関連するビジュアルワークフローに対応します。

graphviz は、DOT ベースで自動レイアウトの有向グラフ・無向グラフを作成するための図解スキルです。依存関係ツリー、呼び出しグラフ、パッケージ階層、所有関係マップなど、手動の配置よりも読みやすい構造が重要な graphviz for Diagramming の用途に向いています。エージェントが妥当な DOT を生成しやすくなり、レンダリングエラーも減らせます。

logo-generator は、製品、ブランド、コンセプト向けに、プロフェッショナルなSVGロゴと洗練された紹介用画像を作成するのに役立ちます。デザインパターンの指針、6種類以上のロゴバリエーション、SVGからPNGへの書き出し、背景付きのショーケース生成を組み合わせています。編集可能な成果物とそのまま使えるプレビューを備えた、ブランディング用の素早く体系立ったlogo-generatorガイドが必要なときに、この skill を使ってください。

inline SVGを使った洗練されたダークテーマのアーキテクチャ図を、単体のHTMLファイルとして作成します。architecture-diagramスキルは、システムアーキテクチャ、インフラ、クラウド、セキュリティ、ネットワークトポロジーの図に最適化されており、ブラウザですぐ使えるビジュアルを、意味のある色分け、明確なコンポーネント関係、一貫した技術スタイルで提供します。

makepad-2.0-vector は、SVGライクなUIデザイン作業のための Makepad 2.0 Vector グラフィックス用スキルです。Vector{} や Svg{} を使って、くっきりしたアイコン、バッジ、イラスト、グラデーション、フィルター、変形、アニメーションするベクター要素を作成するのに役立ちます。このガイドでは、makepad-2.0-vector の導入手順を押さえつつ、実装にそのまま使える出力を、迷いを減らしながら得られます。

seo-imagesスキルは、SEOコンテンツ、商品ページ、編集記事など、画像量の多いページを対象に、画像SEOとパフォーマンスを分析します。altテキスト、ファイルサイズ、形式、レスポンシブ配信、遅延読み込み、CLSリスク、画像SERPでの表示、さらにWebP/AVIFやIPTC/XMPメタデータなどの最適化 विकल्पをチェックします。実用的で優先順位のついた画像監査が必要なときに使うスキルです。

logo-creator は、コンセプト作成、バリエーション比較、トリミング、背景除去、SVG アセット書き出しまでを一連で進められる AI ロゴ制作ワークフローです。ReScienceLab/opc-skills で、スタイル参照、プロンプト例、補助スクリプトを活用しながら、ロゴ、アイコン、favicon、ブランドマーク制作に対応します。