Skills
エージェント向けにパッケージ化された専門スキルと手順を 97,501 件掲載。コマンド 1 行でインストールできます。
デザイン・UI
円形および放射状の数値選択に、Syncfusion WPF SfRadialSlider を実装します。WPF でラジアルスライダー、円形範囲セレクター、または放射状の数値入力を扱う際に使用します。Value、Minimum、Maximum、TickFrequency、StartAngle、EndAngle、SweepDirection、リム半径係数、カスタム目盛り/ラベル/ポインターテンプレート、SfSkinManager によるテーマ設定を解説します。
ステップ形式のウィザード UI に Syncfusion WPF WizardControl を実装します。WPF で複数ページのウィザードフロー、インストールウィザード、またはセットアップウィザードの画面を構築する際に使用します。WizardPages の追加、ページタイプ(Blank、Interior、Exterior)の設定、ナビゲーションボタン(Back、Next、Finish、Cancel、Help)の制御、ItemsSource のデータバインディング、非線形ナビゲーション、バナー画像のカスタマイズを解説します。
バイブコーディングされたウェブページを、あなた自身のデザインシステムのみで構築されたページに変換する。AI が生成した成果物、ランディングページ、プロトタイプ、独自の CSS を含むあらゆるページを受け取り、各領域の意図を読み解き、実際のコンポーネントと実際のトークンで再構築する。ユーザーが "rebuild this with our design system"、"convert this page"、"make this use our components"、"de-vibe this"、"kill the vibes"、"turn this artifact into something real" と言う場合、HTML ファイルや URL を貼り付けて自身のデザインシステムを挙げる場合、またはページがシステムへ移行する前後のデモを求める場合に使用する。デザインシステムのランタイムとコンポーネント語彙の一回限りのプロファイルを構築し、それに対して変換する。製品全体の移行を計画する ds-adoption-plan の companion であり、こちらは単一のページを変換して動作するコードを返す。
Apple Human Interface Guidelines(iOS 26)に準拠した Expo / React Native の iOS インターフェース。ネイティブナビゲーション(Expo Router のネイティブスタックとタブ)、プラットフォームコントロール(Alert、ActionSheetIOS、expo-symbols 経由の SF Symbols)、セーフエリア、ダークモード、Dynamic Type、触覚フィードバック、Liquid Glass、アクセシビリティ、60fps のモーションを扱います。React Native/TypeScript でのアーキテクチャとスタイルの判断を対象とします。@expo/ui の SwiftUI コンポーネント API には expo-ui スキルを、ネイティブ Swift には ios-hig を使用してください。該当アプリの構築、レビュー、リファクタリング時に起動します。ユーザーが「HIG」や「ネイティブらしさ」と言っていなくても、Expo で iOS 向けの TSX 画面、ナビゲーション、リスト、フォーム、スタイルを書いている場合は対象です。
Layer でゲームやアプリのストア掲載用アートを制作する場合に使用します。アプリアイコンとそのバリエーション、キャプション付きスクリーンショット一式、フィーチャーグラフィック、Steam のカプセル画像やヘッダーアート、アプリのプレビュー動画などが対象です。1枚のキービジュアルをストア指定のすべてのサイズに展開する場合や、ロゴやアイコンがサムネイルサイズで判別しにくくなる場合にも使用します。キーワード:アプリアイコン、ストア掲載、スクリーンショット、App Store、Google Play、Steam カプセル画像、フィーチャーグラフィック、ASO、プレビュー動画。
Layer アセットに正確な文言を表示する必要がある場合に使用します。ブランドフォントを使ったタイトル、ロゴロックアップ、CTA、ボタンラベル、価格、キャプション、または正確なつづりを保ち編集可能にするテキストに対応します。生成テキストのつづりが誤っている場合、ブランドの .ttf や .otf を使う場合、画像内の既存テキストを変更する場合にも使用します。キーワード:タイポグラフィ、テキストオーバーレイ、ブランドフォント、レタリング、タイトルカード、CTA、ラベル、テキストのレンダリング、合成、フォントファイル
Mobbin MCP を使った UI/UX 調査に使用します。画面リファレンス、フロー調査、競合調査、パターンの探索、PRD に基づく調査、または対象 UI をコンポーネントごとに調べて開発に最適な参考例を選ぶ作業に対応します。次のような場合に使用します。Mobbin の検索や調査、画面リファレンス、プロダクトフロー調査、パターン分析、競合 UI 監査、UX ベンチマーク、オンボーディング/チェックアウト/空状態/エラー状態/確認画面、フィンテックや暗号資産の UX、AI プロダクトのパターン、SaaS ダッシュボードのパターン、EC チェックアウトのパターン、PRD 調査、UI や画面の構築・実装、各コンポーネントに最適な参考例の検索、デザインコンポーネントの調査、コンポーネント単位のリファレンス調査、抽象的なプロダクトの質問を具体的な画面やフローの検索に落とし込む場合。このスキルは Mobbin MCP サーバー専用で、Refero など他のデザインリファレンスツールは使用しません。
反復的な改善と学習メモリ機能を備えた、スクリーンショットから HTML プロトタイプを生成するツールです。ユーザーがスクリーンショット、モックアップ、ワイヤーフレーム、または UI 画像を提示し、動作する HTML プロトタイプとして再現したい場合、あるいは以前に生成したプロトタイプを修正したい場合に使用します。「照这个做原型」「参考这个图」「把这个页面画出来」「this UI needs to be prototyped」「replicate this design」「convert this mockup to HTML」「帮我出个原型」「根据截图输出 HTML」や、画像添付と「输出 HTML」「做成页面」「帮我实现」などの依頼の組み合わせでも起動します。「加一个字段」「这个也一样」のような短い指示とスクリーンショットだけの場合も、表示された UI の修正または再現を意味するため、このスキルを使用します。迷った場合は、会話に UI スクリーンショットがあれば使用してください。
インプレースの階層ツリーナビゲーションとドリルダウンパネル向けに、Syncfusion WPF SfTreeNavigator を実装します。WPF で階層型ナビゲーションパネル、ドリルダウンナビゲーション、パンくず形式のツリーナビゲーションを構築する場合に使用します。宣言的な項目作成、HierarchicalDataTemplate を使用した ItemsSource データバインディング、Default および Extended ナビゲーションモード、HeaderTemplate のカスタマイズ、MVVM ベースの SelectedItem 選択を扱います。
ウェブサイトの複製/クローン手法。ユーザーがウェブサイトの複製やクローン、サイトの模倣、このサイトを基にした制作、サイトの再現、ウェブページの効果の再現、サイトをダウンロードして改変すること、またはインタラクション/WebGL/Canvas/Three.js の効果の複製を求めた場合に使用します。「まず実際のソースを取得 → 方針を判断 → リバースエンジニアリングして分解 → プロジェクトを構築 → コンテンツを差し替え」という移植可能な判断ツリーを提供します。静的サイト、React/Vue/Next コンテンツサイト、WebGL-Canvas を多用するフロントエンドサイトの 3 分岐を網羅し、AI による二次分析に含まれる実行可能コードの確認を必須とします。
Layer でモーショングラフィックスを制作する際に使用します。ロゴのリビールや短い演出、待機中のロゴループ、アニメーションタイトル、ローワーサード、エンドカードや CTA カード、キネティックタイポグラフィ、予告編や広告のブランドイントロ/アウトロに対応します。リビール後のロゴが歪む場合、生成された文字のつづりが誤っている場合、キーフレームなしで文字を動かす場合にも使用します。キーワード:モーショングラフィックス、ロゴリビール、ロゴアニメーション、短い演出、タイトルカード、ローワーサード、エンドカード、キネティックタイポグラフィ、イントロ、アウトロ
戦略分析や経営幹部向けプレゼンテーションのための、プロフェッショナルなコンサルティングスタイルのデータ可視化・インフォグラフィック作成スキルです。McKinsey/BCGスタイルで、情報密度が高く役員会に適した、組織としての信頼感と金融レポートの編集美を備えたビジュアルを作成します。表紙スライドを含む11種類の可視化、16進コード付きの詳細なカラーパレット、アスペクト比の基準、プロンプトエンジニアリングのテンプレート、洞察に基づく成果物のための戦略的な構成ガイドを扱います。
プロジェクトに SVG グラフィック(インライン SVG、外部 SVG ファイル、SVG アイコン、SVG イラスト、SVG ベースのデータビジュアライゼーション)が含まれる場合は、必ずこのスキルを読み込みます。必要に応じて、SVG に適切なアクセシブルなタイトル、説明、ARIA ロールを必ず設定します。意味のある SVG には必ず <title> と <desc> を追加し、role="img" を設定して aria-labelledby からそれらの要素を参照します。信頼できない SVG やユーザーがアップロードした SVG をプロジェクトで受け付ける場合にもこのスキルを適用し、描画前にサニタイズします。
Windows Presentation Foundation アプリケーションで地理データを可視化する Syncfusion WPF Maps (SfMap) コントロールを実装します。地理データの表示、シェープファイルのレンダリング、マップレイヤーとマーカーやバブルの統合に使用します。このスキルでは、ShapeFileLayer、ImageryLayer、マップのカスタマイズ、凡例、OpenStreetMap/Bing Maps の統合、インタラクティブなマップ機能を扱います。
WPF アプリで Markdown コンテンツをレンダリング、表示するために Syncfusion WPF SfMarkdownViewer を実装します。Markdown テキストのレンダリング、文字列やアプリが管理するローカルファイルからの読み込み、URL 検証を伴うハイパーリンククリックの処理、入力のサニタイズを伴う Mermaid 図の表示に使用します。Source プロパティ、許可リストに基づくナビゲーションを行う HyperlinkClicked イベント、入力検証を伴う MermaidBlockTemplate のカスタマイズを扱います。特にリモートまたはユーザー提供のコンテンツでは、Markdown を Source に設定する前に必ず検証してサニタイズしてください。
インテリジェントなテキスト補完機能を備えた AI 対応の複数行入力コントロール、Syncfusion WPF Smart Text Editor (SfSmartTextEditor) を実装します。WPF アプリケーションでスマートテキストエディター、AI によるテキスト入力、予測テキスト候補を実装する際に使用します。このコントロールは Azure OpenAI、OpenAI、Ollama、Claude、Gemini、Groq、DeepSeek などの AI サービスと連携し、コンテキストに応じた入力支援を提供します。候補の 2 種類の表示モード(インライン/ポップアップ)、オフライン候補用のカスタムフレーズライブラリ、テキストの包括的なカスタマイズ、ワークフロー統合向けの包括的なコマンド処理を備えています。
ドロップダウンメニュー、コマンドバインディング、データバインディングを備えた Syncfusion WPF SplitButton (SplitButtonAdv) を実装します。スプリットボタン、メニュー付きドロップダウンボタン、またはボタンとメニューの組み合わせを扱う際に使用します。このスキルでは、SplitButtonAdv の設定、ドロップダウンメニュー付きの既定アクション、コマンドバインディング、MVVM の実装、WPF アプリケーションでデータバインディングされたドロップダウン項目を扱います。
ウェブと UI のタイポグラフィ:モジュラー型スケール、フォントの組み合わせ、見出しの階層、読みやすい本文、fluid な clamp() サイズ指定、可変フォント、フォント読み込み、テキスト効果。フォントやテキストのスタイル設定に関するタスクで使用します。トリガーフレーズ:「typography」「font pairing」「type scale」「heading sizes」「responsive text」「font combination」「text style」「variable fonts」「fluid typography」「google fonts」「line height」「font loading」。完全なトークンシステム(余白、色、コンポーネント)には design-system を使用してください。ここで定義されたスケールを利用します。
デザイントークンのセットを Subatomic の 3 層アーキテクチャ(definitions → usage → components)に照らして検査し、根拠タグ付きの所見と優先順位付けされた作業リストを返す。または、まだトークンがない本番コードベースから階層ラダーを確立する。ユーザーが token JSON を貼り付けて「これで正しいか」と尋ねるとき、トークンの監査、評価、レビュー、採点を求めるとき、トークンが適切に階層化されているか、またはセマンティックかどうかを尋ねるとき、ダークモードや 2 つ目のブランドがリマップで済むのか書き直しになるのかを知りたいとき、あるいはハードコードされた値だらけのコードベースからコードファーストでトークンの基盤を築きたいときに使う。ds-inspection(10 のステーションでシステム全体を採点する)の補完であり、本スキルはトークン層のみを深く扱う。
Figma ノードツリーを WCAG 2.2 のアクセシビリティとデザインシステム品質の両面から lint します。コントラスト、ターゲットサイズ、フォーカスインジケーター、色だけによる情報伝達、ハードコードされた色、テキストスタイルの欠落、コンポーネントの切り離しなどを確認します。引き渡し前にデザイン側の監査を行いたい場合に使用します。該当する依頼例:「lint this frame」「check accessibility」「WCAG audit」「is my design accessible」「find contrast issues」「check color contrast」「find hardcoded colors」「are my components using tokens」「design QA」「a11y check on this page」「audit my design for issues」。ノードまたはページ全体からツリーをたどり、重大度(critical/warning/info)と WCAG レベル(A/AA/AAA/best-practice)を付けて結果を返します。ネイティブ Figma MCP にデザイン側の lint 機能はありません。この機能はこのコレクション独自です。コンポーネント単位の詳細なアクセシビリティ評価には figma-audit-accessibility、コード側(HTML)のチェックには figma-scan-code-accessibility を使用してください。
Penpot デザインシステムの token + ライブラリ基盤を構築・統治する:primitive/semantic/component の token 階層、テーマ(ライト/ダーク)、既存のハードコードされたデザインから token システムを推論する。コンポーネントや画面を構築する前に、またはデザインに生の値があり token 化すべき場合に使用する。トリガー:'set up design tokens'、'create a token system'、'build the design system foundation'、'add dark mode tokens'、'infer tokens from this design'、'tokenize this file'、'create semantic tokens'、'apply tokens to these shapes'。
Amazon A+ コンテンツ(旧 Enhanced Brand Content)を設計する — ブランド登録セラー向けに、標準の商品カルーセルの下に表示される 8 モジュールのスイート。Hero Banner(21:9 / 2388×1024)、Pain Points / Selling Points / Technology / Data / How-to-Use / Variants(3:2 / 1536×1024)、Endorsement(21:9)をカバーし、モバイルのセーフエリア規則、30pt の文字サイズ下限、メイン画像 URL に紐づくモジュール間の一貫性を含む。ユーザーが「A+ ページ」「A+ コンテンツ」「Amazon A+」「Brand Content」「Enhanced Brand Content」「亚马逊详情页」「A+ 详情页」「21:9 banner」「Hero Banner」「Amazon detail page module」と言う場合、またはブランド登録の詳細ページモジュールスイートを求める場合に使用。1:1 のメイン画像とカルーセルのサブ画像については `product-shots-main-image` スキルを参照。
AI アプリケーションが外部のツールやデータソースに統一的な方法で接続するためのオープンなプロトコルです。クライアントはモデルとの対話を担い、MCP サーバーはツール・リソース・プロンプトテンプレートを提供します。標準メッセージでやり取りするため、1 つのサーバーを複数のクライアントで再利用できます。
