Skills
エージェント向けにパッケージ化された専門スキルと手順を 96,981 件掲載。コマンド 1 行でインストールできます。
デザイン・UI
フロントエンドコードにおける AI 生成的な UI の収束パターン（「AI slop」）を検出、レビュー、防止、除去する。UI を構築またはスタイリングするとき、フロントエンドの変更をレビューするとき、ビジュアルデザインを洗練させるとき、またはユーザーが AI らしさの除去、人間が設計したと感じられるインターフェースの実現、ページの仕上げ、UI 品質の監査、あるデザインがなぜ凡庸に感じられるかの説明を求めたときに使用する。HTML、CSS、JSX/TSX、Vue、Svelte、Tailwind をカバーし、カタログ化された 46 のパターンに加えて構成レベルのチェックを監査し、ソースで確認された証拠、レンダリングで確認された証拠、判断に基づく証拠を区別し、外部依存を必要とせずに、許可されたコードを製品固有のデザイン方向へ書き換える。
IBM の Carbon Design System を使って UI を構築する。ユーザーが Carbon スタイルのインターフェース、IBM 風のダッシュボード、Carbon の規約に従ったエンタープライズ UI を求めた場合、または Carbon、IBM デザイン、@carbon/react に明示的に言及した場合に使用。コンポーネントの使い方、デザイントークン（色、タイポグラフィ、スペーシング、モーション）、テーマ（White、Gray 10、Gray 90、Gray 100）、グリッドレイアウト、アクセシビリティを扱う。アーティファクト/HTML 出力（CDN ベース）と完全な React プロジェクト出力（@carbon/react）の両方に対応。トリガーには "Carbon"、"IBM design system"、"enterprise dashboard"、"@carbon/react"、"carbon components"、または IBM 風のプロフェッショナルなインターフェースの要望が含まれる。
一般的な AI 的な美学を避け、UI/Web デザイン向けの独自性がありアクセシブルなカラーパレットを作成する。Web サイト、アプリケーション、その他思慮深い色選択を必要とするあらゆるデジタルインターフェースを設計する際に使用する。厳選されたドメイン別パレット、色彩理論のガイダンス、アクセシビリティの検証、乱用されがちなパターン（紫のグラデーション、オレンジとティールの組み合わせ、ありきたりなテックブルー）から脱却するための戦略を提供する。コントラストチェッカー、パレットジェネレーター、ドメイン別（テック/SaaS、E コマース、ヘルスケア、金融、クリエイティブ、食品）に整理された包括的な参考資料を含む。
ユーザーが element-ai-vue コンポーネントを統合・使用して、AI チャット UI、Markdown レンダリング、コードハイライト、タイプライター効果などの AI インタラクション機能を構築できるように支援します。ユーザーが AI チャット、会話 UI、Markdown 表示、コードハイライト、思考チェーン、メッセージバブル、チャット内のファイルアップロードに言及した場合、または element-ai-vue の具体的なコンポーネント名（ElAMarkdown、ElABubble、ElASender、ElAThinking、ElATypewriter など）に言及した場合にこのスキルを起動します。ユーザーが element-ai-vue プロジェクト自体で作業し、コンポーネントを追加・変更したい場合にもこのスキルを使用します。AI 会話、チャット UI、タイプライター効果、Markdown レンダリング、思考プロセスの表示に関連するニーズが言及された場合は、必ずこのスキルを積極的に使用してください。
Excalidraw のシーンファイル（`.excalidraw`）を作成・編集する：JSON 要素モデル（rectangle、text、arrow）、双方向の矢印バインディング、ids/z-order、座標とサイズ、グループ、既存シーンの読み取り・更新。2 つの方法 — 小さなシーンや編集は手作業で、または `scripts/` によるプログラム的な方法で、Excalidraw 自身の `convertToExcalidrawElements` でシーンを構築し、`exportToSvg` で忠実なプレビューをレンダリングし、ジオメトリをリントする。`.excalidraw` ファイルを（エディタ UI を介さずに）直接作成・変更する場合に使用。Mermaid は標準的な図のためのサポートされた INPUT であり、ファイル形式ではない。
小規模なローカルブリッジを介して Python スクリプトで起動中の FreeCAD（オープンソースのパラメトリック CAD アプリ）をリモート操作し、3D モデルをリアルタイムで作成・編集します。ボックス／円柱プリミティブとブーリアン演算、フィレット／面取りソリッド、拘束付き Sketcher プロファイル、パラメトリック PartDesign フィーチャー（パッド、ポケット、回転、パターン）、2D Draft ジオメトリ、メッシュ、TechDraw 図面に対応し、測定、ビューポートのスクリーンショット取得、STEP / IGES / BREP / STL / OBJ へのエクスポートも行います。ユーザーが CAD モデル、3D パーツ、機械部品、筐体、ブラケット、.FCStd ファイルを作成・編集したい場合、モデルを STEP/STL/IGES/OBJ に変換またはエクスポートしたい場合、「FreeCAD」「CAD モデル」「パラメトリックパーツ」「3D パーツを作成」「STEP にエクスポート」「印刷用 STL」と言った場合に使用します。スクリプトに言及していなくても使用します。
OpenAI Image API (gpt-image-2) を使用して画像を生成または編集します。ユーザーが画像、アイコン、ロゴ、モックアップ、イラスト、OG 画像、ブログのヒーロー画像、マーケティング素材などのビジュアルの生成、作成、描画、レンダリング、イラスト化、モックアップ作成、編集を依頼した場合に使用します。参考画像が提供され、変更、スタイル変更、リミックスを求められた場合にも使用します。トリガー：「generate an image」「create an image」「make a picture of」「edit this image」「restyle this」「make a mockup of」「draw a」「render a」「illustration of」。
地元ビジネスの見込み客向けに、目を引く新しいウェブサイトを構築する。完全版の website-rebuild skill を基に、投機的な地元ビジネスの提案向けに最適化。10 フェーズのプロセス：ブランド抽出、SEO 監査、デザイン監査、再構築計画、デザインシステムを用いた完全ビルド、コピー最適化、統合 QA、デプロイ前チェックリスト、monorepo への出力。prospect-scrape でスクレイピングしたコンテンツを入力として使用。ツール/計算機の調査フェーズはなし。単一の統合 QA ラウンド。トリガー："rebuild prospect"、"local business rebuild"、"build prospect site"、"rebuild their site"、"prospect rebuild"、または適格な見込み客向けの新しいウェブサイト構築の依頼。
ブランド探索、アーキタイプのマッピング、反復的な洗練を通じて 9 個以上の SVG ロゴ案を制作し、最終的に選ばれた案から完全なアプリアセットパッケージ（iOS、Android、macOS、Windows、favicons、PWA、ソーシャル）を生成するプロフェッショナルなロゴデザインスタジオ。オプションで複数ページのブランドガイドラインドキュメント（ロゴ、カラー、タイポグラフィ、レイアウト、UI コンポーネント、モーション、ボイス、アセット管理）も作成します。ユーザーがビジネス、製品、プロジェクトのロゴ、ブランドマーク、アイコン、ワードマーク、アプリアイコン、ビジュアルアイデンティティ、ブランドガイドラインを求めたときに使用します。
Telefonica の Mistica デザインシステムの React コンポーネントを使ってウェブサイトや Web アプリを構築します。@telefonica/mistica で React の UI コードを書くとき、ページ、レイアウト、フォーム、または Telefonica のデザインガイドラインに従うべきあらゆるユーザーインターフェースを作成するときにこのスキルを使用します。Mistica コンポーネント、Telefonica のブランディングを扱うタスク、またはユーザーが Mistica に言及したときに発動します。
Web アニメーションやレンダリング性能の作業を最適化・監査・出荷準備するときに使用する：フレームループ、スクロール／ビューポート表示、マウント／アンマウント遷移、canvas／WebGL のライフサイクル、モーションの低減、遅延レンダリング、画面外の遅延処理など。ジャンク、フレームごとのアロケーション、強制リフロー、レンダリングループ、画面外で一時停止しないアニメーション、content-visibility、requestIdleCallback、アニメーションやレンダリング問題のための Chrome DevTools パフォーマンストレース分析、ブラウザ駆動の CSS／WAAPI・最小限の JS・phase・Motion／GSAP の選択に使用する。ユーザーが phase の API や挙動について明示的に尋ねたときに使用する。探索的なアニメーションの構想、プロトタイピング、視覚的な反復、バリアントの試行には使用しない。コードがすでに phase を import していても同様であり、ユーザーが性能ガイダンス、監査、本番実装、出荷準備レビュー、または phase 自体について求めるまで待つ。
picture-it を使って CLI から画像を生成・編集します。ユーザーが画像の作成、編集、加工（ブログヘッダー、ソーシャルカード、ヒーロー画像、製品比較、YouTube サムネイル、映画ポスター、雑誌の表紙、Instagram 編集、背景除去、その他のビジュアルコンテンツ）を求めたときはいつでもこのスキルを使用します。ユーザーが picture-it を名前で挙げた場合、画像を合成したい場合、カラーグレーディングを適用したい場合、画像にテキストを追加したい場合、背景を削除・置換したい場合、写真をトリミング/リサイズしたい場合、またはターミナルからの画像生成や写真編集を必要とする場合にもトリガーします。このスキルは、組み合わせ可能な操作をつなげるマルチパスの AI 画像編集ワークフローを扱います。
出版品質の科学・技術図表を作成、スタイル設定、エクスポート、検証する。xy が推奨のデフォルト（matplotlib.pyplot 互換で移行が容易）。matplotlib/seaborn/plotly にも対応。ユーザーが「publication figure」「paper figure」「journal-ready plot」「scientific visualization」「SVG/PDF/TIFF export」「colorblind-safe palette」「multi-panel layout」「error bars / significance markers」を求める場合、または matplotlib、seaborn、plotly、xy をインポートする図表スクリプトを扱う場合に使用する。
shadcn のコンポーネントとプロジェクトを管理し、追加、検索、修正、デバッグ、スタイリング、UI の組み立て（チャットインターフェースを含む）を行います。プロジェクトのコンテキスト、コンポーネントのドキュメント、使用例を提供します。shadcn/ui、コンポーネントレジストリ、プリセット、--preset コード、または components.json ファイルを含むプロジェクトで使用します。また、「shadcn init」「create an app with --preset」「switch to --preset」の実行、デザインシステムの構築、DESIGN.md やブランド仕様の shadcn/ui への適用時にも使用します。
PBIR レポートでインライン可視化を行うための、DAX メジャーと ImageUrl データカテゴリを用いた拡張メジャーによる SVG 生成。マトリックスやテーブルのセル、新しいカード画像、新しいボタンスライサー上のボタンごとの画像向けのすぐ使えるテンプレートを含む。ユーザーが "SVG visual"、"DAX sparkline"、"SVG measure"、"inline graphics with DAX"、"ImageUrl data category"、"extension measure" に言及した場合、または DAX で生成する任意のチャート（プログレスバー、バレットチャート、KPI インジケーター、データバー、ゲージ、ドーナツチャート、ロリポップチャート、ダンベルチャート、ステータスピル、重複バー、ボックスプロット、IBCS バー、ジッタープロット、箱ひげ図）の作成を求められた場合に自動的に呼び出す。
AI アプリケーションが外部のツールやデータソースに統一的な方法で接続するためのオープンなプロトコルです。クライアントはモデルとの対話を担い、MCP サーバーはツール・リソース・プロンプトテンプレートを提供します。標準メッセージでやり取りするため、1 つのサーバーを複数のクライアントで再利用できます。