Skills
エージェント向けにパッケージ化された専門スキルと手順を 97,222 件掲載。コマンド 1 行でインストールできます。
デザイン・UI
ユーザーが AI 画像生成ツール(NanoBanana / Gemini / DALL-E / Midjourney)向けの詳細な英語プロンプトを要求し monetizeテ adopters學に公认トップ会議品質の学術図 版を求めている場合、このスキルを使用してください。対象にはフレームワーク図、ネットワーク構成図、パイプラインフロー図、モジュール詳細図、比較/アブレーション図、データパターングリッドが含まれます。特にユーザーが「論文配图提示词」「生成论文配图」「学術論文の図生成」「アーキテクチャ図のプロンプト」「フレームワーク図のプロンプト」「トップ会議スタイルの図」「CVPR スタイルの図」「NeurIPS スタイルの図」「paper figure prompt」「academic diagram prompt Gomesposer」と言った場合や、LaTeX/PDF/Word の論文を提示して図のプロンプトを求めた場合に合 mag。カラースキームが指定されていない場合は、プロンプトを生成する前に、8種類のプリセットパレットとカラーツールのリンクを提示します。
データダッシュボードを設計するときに使用するスキル——KPI の選定、レイアウトの構成、視覚的階層の適用、どの BI ツールを使うかの判断。トリガーフレーズ:''design a dashboard''、''build a KPI dashboard''、''what should my dashboard show''、''help me layout a dashboard''、''dashboard for monitoring''。チャートコードをゼロから書く場合(chart-builder を使用)、SQL クエリを書く場合(sql-analyst を使用)、マーケティングのランディングページを設計する場合には使用しない。
適切な KPI 階層、チャートタイプの選択、インタラクティブ機能を備えた効果的なデータダッシュボードを設計する。ユーザーがダッシュボードを作成する、適切な可視化を選ぶ、異なる対象者向けに指標を整理する、ダッシュボードツールを評価する必要があるときにこのスキルを使用する — 'build a dashboard'、'our reports are confusing'、'which chart should I use'、'executives can't find the metrics they need' と言った場合でも。
カラースキーム、タイポグラフィ、スペーシング、角丸、シャドウからなるデザイントークンの基盤を、実際のトークンファイル(CSS 変数および Tailwind テーマ)として作成または抽出し、現在のハードコード値からの移行マップを添える。ユーザーが「デザインシステムを構築して」「スタイルが不統一」「同じ青が 50 段階ある」「デザイントークンを追加して」「デザインを正式化して」「新機能を合わせて」と言ったとき、または画面を作る前に基盤が必要な新規フロントエンドを始めるときに使う。他のデザイン作業がアドホックな値と衝突し続けるときの最初のステップでもある。トークンファイル、ダークモードに対応させたグローバル→セマンティックトークン構造、優先して移行すべき乖離の短いリストを生成する。
Draw.io MCP サーバーを使って、あらゆる形状やベンダーの図を作成・編集します。用途:図の作成、アーキテクチャ図の作成、図への Azure/AWS/GCP/Cisco/Kubernetes アイコンの追加、Mermaid から draw.io への変換、矢印の重なりの修正、.drawio ファイルの編集、ネットワークトポロジ図、CI/CD パイプライン図、認証フロー図。XML、Mermaid、CSV に対応します。drawio/search_shapes を使って、すべてのベンダーおよびアイコンライブラリから 10,000 種類以上の形状を検索します。Excalidraw 出力には使用しないでください(excalidraw-mcp-diagramming スキルを使用してください)。
持続的な集中を支え、気を散らす要素を減らすインターフェースを設計する。ADHD、注意困難、不安を抱えるユーザー向けの設計や、集中が重要なあらゆる場面——ダッシュボード、読書体験、タスクフロー、フォーム、学習インターフェース——で使用する。トリガー:focus、distraction、ADHD、attention、too busy、cluttered、visual noise、autoplay、notifications、pop-ups、interruptions。
製品の実際のデザインシステムを維持または拡張する必要があるフロントエンド UI 作業にこの skill を使用する:新しい画面/コンポーネント、ハイファイ再現、リスタイル、非自明なフォーム、ロール制限付き UI、大きな挙動変更、またはレイアウト、体験、スタイルガイド、クリーンな実装計画、最終的なコード生成を必要とする UI 実装。インストールすべき唯一のフロントエンド skill であり、自己完結していて、同梱のリファレンスを用いて軽量な UI 編集とフルフロントエンドワークフローの間をルーティングする。
クロスゲームのパターンカタログと設計フレームワーク(MDA、コアループ、フロー、ゲームフィール、エコノミー)に基づいて、ビデオゲームのメカニクス、システム、インターフェースを分析、設計、批評、バランス調整、作り直す。設計に触れる変更や議論の最初の窓口であり、Godot などのエンジンでの実装途中も含む。使用場面:メカニクス、進行、エコノミー、ロードアウト、インベントリ、ルート、ショップ、敵や難易度のスケーリング、報酬、メニュー、UI システムの設計、バランス調整、ブレインストーミング、作り直し。ドロップ率、価格、カーブ、スケーリングの調整。面白いか、グラインドが過剰か、支配的な戦略があるかを問うとき。メニュー、HUD、トランジション、オンボーディング、対話、ガイダンス、入力プロンプト、アクセシビリティの設計。ゲームのアイデア、コンセプト、ビジョン、設計の柱、GDD の記録、ピッチ、反復を、生きたコンセプトバンドルとして永続化するとき。またはゲームシステムを構築しながら自らそれらを執筆するとき。godot と並走し、godot がエンジンコードを書き、本スキルがそのコードが何をすべきかを決める。
インタラクションデザイン(IxD)の原則とフレームワークをプロダクトおよびサービスのデザイン業務に適用する。インタラクションフロー、マイクロインタラクション、フィードバック機構、アフォーダンス、メンタルモデル、コンポーネントの状態、応答時間、アニメーションとトランジション、エラー回復、入力検証、タスクフロー、ナビゲーションパターンを設計または評価するときにこのスキルを使用する。主な対象:デジタルプロダクトとサービスに携わるプロダクトデザイナー、UX デザイナー、UI デザイナー、サービスデザイナー、インタラクションデザイナー。トリガー:インタラクションフロー、マイクロインタラクション、アフォーダンス、フィードバックデザイン、状態設計(hover/focus/error/loading/empty)、応答時間、トランジション、アニメーション、メンタルモデル、タスクフロー、ユーザーフロー、ナビゲーションデザイン、インタラクション仕様、ハンドオフ注釈、ジェスチャー、入力検証、エラー状態、ローディング状態、空状態、システムフィードバック、シグニファイア、デザインレビュー、インタラクション監査、IxD 原則。
Niko Table(TanStack Table を使った shadcn 互換のデータテーブル)と編集可能な Data Grid を統合して使用する。ユーザーが Niko Table、niko-table.com、shadcn のデータテーブル、TanStack Table、並べ替え・絞り込み可能なテーブルの構築、ファセットフィルター、高度なフィルターメニュー、行・列のドラッグ&ドロップ、サーバーサイドページネーション、サーバーサイドグリッド、無限スクロール、Drizzle ORM、nuqs、URL 状態、共有・ブックマーク可能なテーブル、行の展開、ツリーテーブル、行選択、編集可能なスプレッドシートグリッド、useDataGrid、DataGrid のセルエディター、クリップボード/フィルハンドル、useGridChanges、その他 shadcn 互換のデータグリッドに言及した場合に使用——Niko Table と明示していなくてもよい。タスクが React/shadcn プロジェクトのデータテーブルや編集可能なグリッドに関わる場合は常にこのスキルを優先し、モデルが Niko Table の構造、インポート、パターンに従うようにする。
埋め込み Salla アプリ内でのアプリ内アドオン購入 UX——アプリのアドオンを一覧表示し、ネイティブのチェックアウトを開き、埋め込み SDK の Checkout モジュール(`embedded.checkout.getAddons` / `.create` / `.onResult`)で支払い結果を受け取ります。課金は Salla が担います。iframe 内で支払いを回収しないでください。埋め込みページで購入/アップセル UI を構築する場合や、チェックアウトの受け渡しを配線する場合に使用します。埋め込みフローの一部 → salla-embedded-app。購入後の有効化とエンタイトルメントのライフサイクル → salla-addon-purchase。
Salla アプリの STOREFRONT(ストア)UI をネイティブにする——Twilight テーマ上の購入者向けページ。Storefront JS SDK で駆動するネイティブ `<salla-*>` Web コンポーネントで構築し、Twilight CSS トークンを継承し、Salla Icons(`sicon-*`)を使用し、ページの余白に合わせ、アラビア語優先/RTL で記述し、インストール済みのデモストア(`url`)で LIVE スクリーンショットにより検証する。スニペットが可視 UI を描画する場合に使用。注入レシピ → salla-snippets。埋め込み/ダッシュボード UI → salla-embedded-ui。
skillui コマンドラインを使って、あらゆるウェブサイト、ローカルディレクトリ、公開 GitHub リポジトリから完全なデザインシステムを抽出する。Claude が自動的に読み取る SKILL.md、DESIGN.md、トークンファイル(colors.json、spacing.json、typography.json)を生成する。UI を構築する前に既存のサイトやコードベースからデザインシステムやデザイントークンを抽出したい場合、照合するための参照デザインシステムが欲しい場合、'extract the design system from'、'get the tokens from'、'pull styles from this site'、'clone the look of' などと言った場合、または URL/リポジトリを提示してそのビジュアル言語に合わせたい場合に使用。
アイコン、イラスト、ロゴ、図、インフォグラフィック、パターン、アニメーション、抽象アートを含む高品質な SVG グラフィックを作成します。ユーザーが SVG 画像、ベクターグラフィック、アイコン、ロゴ、バッジ、図、フローチャート、インフォグラフィック、パターン、アニメーショングラフィックの作成・描画・デザイン・生成を求めたときはいつでもこの Skill を使用します。また、ユーザーが「draw me」「make an SVG」「create a graphic」「design an icon」「vector illustration」と言った場合や、SVG ファイルとして出力するのが最適な視覚成果物を求めた場合にもトリガーします。この Skill は、単一要素のシンプルなグラフィックと、アニメーションを伴う複数レイヤーの複雑なコンポジションの両方を扱います。
データバインディング、オートコンプリート、複数選択、フィルタリング、トークンを備えた Syncfusion Windows Forms SfComboBox コントロールを実装・カスタマイズする。Windows Forms アプリケーションで WinForms コンボボックス、ドロップダウン、SfComboBox、オートコンプリートテキストボックス、複数選択ドロップダウン、トークン入力、コンボボックスのデータバインディング、ドロップダウンのフィルタリング、コンボボックスのカスタマイズを扱うときに使用する。
Windows Forms アプリで階層ツリー構造、ファイルエクスプローラー、組織図、ネストしたデータを表示するための Syncfusion TreeViewAdv コントロールを実装する。階層データ、親子関係、展開可能なノード、ファイルブラウザーインターフェース、フォルダー構造を扱うときに使用する。このスキルは、データバインディング、ドラッグアンドドロップ、ノードのカスタマイズ、編集機能、WinForms のツリー構造のパフォーマンス最適化を扱う。
運動機能の困難、振戦、巧緻性の制限がある人や、支援ポインティングデバイスを使用する人に適したタッチターゲットとポインタ操作を設計する。ボタン、リンク、フォームコントロール、モバイルインターフェース、その他クリック/タップ可能な要素を設計する場合に使用する。トリガー:touch target、tap target、button size、too small to tap、fat finger、motor disability、dexterity、tremor、pointer、click area、hit area、mobile buttons。
ユーザーがターミナル UI を美しく、洗練された、読みやすい、プレミアム、現代的、ブランドらしい、または視覚的に際立つものにしたいと求めたときに使用するスキル。視覚的階層、余白、タイポグラフィ、境界線、カラーパレット、チャート、進捗表示、アイコン、プロンプト、フォーム、ダッシュボード、フレームワークのスタイリングを改善する。以下で積極的に有効化:TUI のビジュアルデザイン、美的な磨き込み、レイアウト構成、ターミナルのタイポグラフィ、カラーシステム、罫線描画、チャートのスタイル、アニメーション、グリフ/アイコンの使用、プロンプトのスタイル、デザイン批評、視覚的なアンチパターン、フレームワーク固有のスタイリング指針。提供:ターミナルデザインの原則、磨き込みチェックリスト、ビジュアルレシピ、アクセシビリティに配慮した美学。
ローカルビジョン CLI:glance(画像の説明/質問/OCR)、ground(ターゲットの位置特定、ピクセルボックス)、detect(要素の一覧)、trace(画像から SVG ジオメトリへ)、crop(ピクセルボックスをファイルに切り出す)、および scripts/html_shot.py(HTML ファイルから画像へ)。画像を扱うあらゆるタスクに使用する — 質問、テキスト、長いスクリーンショットやチャット履歴の分割と文字起こし、要素の特定、比較、HTML/SVG としての再構築、スケッチや図のデジタル化、グラフからの値の読み取り、スクリーンショットからの GUI 操作 — また、与えられた説明に詳細が欠けている場合に自分で画像を再確認するためにも使用する。
テーマ、ブロック、プラグイン、管理画面を対象とした WordPress アクセシビリティレビュー。キーボードナビゲーション、フォーカス動作、セマンティック HTML、ARIA の使用、フォームのラベル付け、スクリーンリーダー対応、コントラストに関連する実装問題のレビュー時、またはユーザーが「accessibility review」「a11y」「キーボードナビゲーション」「フォーカス管理」「スクリーンリーダー」「ARIA」「セマンティック HTML」「アクセシブルなフォーム」「アクセシブルなブロック」に言及した場合に使用する。フロントエンド出力、ブロックのマークアップ、管理画面、インタラクティブな UI 動作における実装レベルのアクセシビリティ問題を検出する。
AI アプリケーションが外部のツールやデータソースに統一的な方法で接続するためのオープンなプロトコルです。クライアントはモデルとの対話を担い、MCP サーバーはツール・リソース・プロンプトテンプレートを提供します。標準メッセージでやり取りするため、1 つのサーバーを複数のクライアントで再利用できます。
