Skills
エージェント向けにパッケージ化された専門スキルと手順を 96,981 件掲載。コマンド 1 行でインストールできます。
デザイン・UI
複数エージェントによる包括的なスライドレビュー(ビジュアル + 教育設計 + 校正、加えて条件付きで TikZ / 整合性 / 内容の実質性)。ユーザーが "full review"、"excellence pass"、"comprehensive check"、"review everything"、"pre-release review"、"slide excellence" と言った場合、またはデッキを教示 / 出荷する前に使用する。ファンアウト型ラッパー——単一の観点のみが必要な場合は `/visual-audit`、`/pedagogy-review`、`/proofread` を直接使用する。
Calendar、DatePicker、DateRangePicker、DateTimePicker、TimePicker を含む Syncfusion ASP.NET Core カレンダーコンポーネントを実装するための包括的なガイド。ユーザーが Syncfusion ASP.NET Core のカレンダー、日付ピッカー、日付範囲ピッカー、時刻ピッカー、日時ピッカー、カレンダービュー、複数選択、イスラム暦、日付範囲の制限、週番号、日セルのカスタマイズ、renderDayCell、日付選択、範囲選択、日付の書式設定、日付マスク、グローバリゼーション、ローカライズ、厳格モード、アクセシビリティ、または ASP.NET Core タグヘルパーアプリケーションにおける関連するカレンダー/日付/時刻 UI について質問した場合は、常に直ちにこの skill を使用する。
Flutter アプリの会話型インターフェース向けに Syncfusion Flutter Chat(SfChat)と AI AssistView(SfAIAssistView)ウィジェットを実装します。メッセージバブル、コンポーザー、アクションボタンをサポートするチャット UI、AI チャットボットインターフェース、メッセージ画面を構築する場合に使用します。この skill は、会話エリアのカスタマイズ、プレースホルダー画面、テーマ設定、RTL サポート、AI アシスタントの統合を扱います。
Syncfusion TypeScript Stepper ナビゲーションコンポーネントを作成・実装する。ステップ付きの進捗インジケーターの表示、ウィザード ワークフローの実装、多段階プロセスの表示、フォームページ間のナビゲーションの表示、ステップ検証の追加、ステップバイステップのガイド体験の構成を行いたい場合にこのスキルを使用する。Stepper コントロール、ステップ構成、方向、イベント、アニメーションを扱う際は必ずこのスキルを参照する。
Three.js シーンの基盤を構築・デバッグします。レンダラー設定、カメラ、シーングラフ、トランスフォーム、リサイズ処理、カラーマネジメント、レンダーループ、リソースの破棄。Three.js シーンの作成、カメラやレンダラーの選択、座標空間や階層のバグ修正、信頼できる WebGL canvas の基盤構築を行う際に使用します。トリガー:three.js scene、WebGLRenderer、PerspectiveCamera、OrthographicCamera、Object3D、scene graph、camera setup、resize canvas、render loop、coordinate system、transform。
TYPO3 v14 の Records モジュールのリストタイプとカスタムバックエンドビューを構成する。グリッド、コンパクト、teaser、カンバン風、タイムライン風、TSconfig、Fluid テンプレート、アイコン、アクセシビリティを含む。レコードのリストタイプ、バックエンドのレコードカード、カスタム Records モジュールビュー、グリッドビュー、コンパクトビュー、teaser ビュー、TSconfig 駆動のレコード表示についてユーザーが言及したときに使用する。
横断的な UI 品質とダッシュボード設計の skill。素人っぽいダッシュボードの 3 つの兆候(データが UI の形を決める、段階的開示、隠れた UI)に加え、Refactoring UI の原則(階層、余白、タイポグラフィ、色、奥行き、仕上げのディテール)と、Spartan/ng、PrimeNG、NG-ZORRO、Angular Material を使う Angular プロジェクトでそれぞれを適用する方法を扱う。ユーザーが磨き上げ、改善、再設計、または「見た目を良くして」と求めたとき、ダッシュボード、テーブル、KPI 画面、データ中心のビューを構築するとき、プロジェクトに視覚的な品質問題があるとき(階層が弱い、余白が曖昧、有色背景上のグレー文字、色だけが唯一のシグナル)、またはユーザーが階層、密度、余白、タイポグラフィ、パレット、影、空状態に言及したときに使用する。実装面ではライブラリ固有の skill(spartan-ng-developer、primeng-developer、ng-zorro-developer、angular-material-developer)のいずれかと、Angular の基礎については angular-developer と組み合わせる。
v0 でユーザー向けソフトウェアを構築、編集、レビューするときはいつでもこのスキルを使用する — Web アプリ、ダッシュボード、マーケティングサイト、コンポーネントライブラリ、または視覚的な出力を生むあらゆるコード変更。"build a UI"、"design a page"、"make a component"、"improve the look"、"polish this"、"make it production-ready" といった依頼や、可視のインターフェースを伴う新しいアプリ/画面/機能を立ち上げるときにトリガーされる。Tailwind CSS のパターン、shadcn/ui コンポーネント、デザイントークン、タイポグラフィ、余白、色、モーション、アクセシビリティ、そして実ユーザーのもとで耐えうるコンポーネントパターンに関する v0 の主張の強いデフォルトを体系化したもの。
任意の動画をシネマティックなスクロール駆動のランディングページに変換する——スクロールに合わせて表示フレームが動画内を進む Apple 風のヒーロー。ユーザーが動画ファイルを提供し、「この動画からランディングページを作って」「スクロールフレームのサイト」「Apple 風のスクロールサイト」「動画をスクラブするヒーロー」「GitHub Copilot のランディングページのように」または同等の依頼をしたときに使用。ffmpeg で等間隔の N フレームを抽出し、スティッキーヒーロー + スクロールに応じて表示フレームを差し替える JS スクロールリスナーを含む自己完結型の HTML ページを構築し、その下に見出し、セクション、CTA を配置する。YUV.AI プロジェクトでは yuv-design-system スキルを Neon モード(ピンク/シアン/白、YUV.AI ウェブのデフォルト)で適用する——Decks(紫/黄)はスライド専用。汎用 / 非 YUV.AI プロジェクトでは、ソース動画に応じて適切なパレットを選ぶ。出力は `index.html` と `frames/` ディレクトリを含む 1 つのフォルダ——任意の静的ホストに置くだけ。
Markdown 記事を WeChat 公式アカウントで使えるインラインスタイルの HTML に変換する。既定では kami の紙風テーマを使用し、kami、magazine-ink、magazine-indigo、magazine-forest、magazine-kraft、magazine-dune、elegant、modern、minimal の複数テーマ切り替えと、フォント、文字サイズ、アクセントカラー、背景色、出力パスなどのパラメータ設定に対応。公式アカウントの組版、記事 HTML の生成、不安定な外部組版サービスの代替に用い、特に本 vault 内の記事を WeChat 公式アカウントのエディタに貼り付けられる形式へ変換するのに適している。
参照専用の UI 回避策レシピのカタログ。自動ロードしないこと —— ユーザーが「1k-ui-recipes」または特定のレシピを名前で明示的に要求した場合にのみ呼び出す(iOS タブバーのスクロールオフセット、startViewTransition、折りたたみタブの横スクロール、Android 下部タブのタッチ傍受、キーボード回避、iOS オーバーレイナビゲーションのフリーズ、web keyboardDismissMode、iOS モーダル Fabric フレームアニメーション、Android バックグラウンドスレッドのタイマー/マイクロタスク)。
スクリーンリーダーを最優先する視点で Web アクセシビリティを監査、実装、修正する。UI コンポーネント、フォーム、ダイアログ、ナビゲーション、動的コンテンツ、その他のインタラクティブ要素を構築またはレビューするときに使用。WCAG 2.2 AA 準拠、ARIA パターン、キーボードナビゲーション、フォーカス管理、支援技術との互換性(NVDA、JAWS、VoiceOver)を扱う。次の場合にトリガー:"accessible"、"a11y"、"screen reader"、"WCAG"、"ARIA"、またはインタラクティブな UI を追加するとき。
Canva で授業計画を授業用スライドデッキに変換します。授業計画から教室用スライドを作成する、授業計画をプレゼンテーションに変換する、授業用デッキを作る、アウトラインから学校用スライドを作成する、生徒向けの授業デッキを生成するよう求められた場合に使用します。入力には、メッセージに貼り付けた授業計画、Canva design ID、名前で指定された Canva ドキュメントまたはデザイン、Canva デザインリンク(例:https://www.canva.com/design/...)を使用できます。
競合ブランドを分析し、アイデンティティの意思決定の前に視覚的・ポジショニング上の空白を見つけるときに使用します。たとえば、競合の色、タイポグラフィ、ロゴ、イメージ、ボイスを監査したり、知覚マップを構築したりする場合です。キーワード — competitive audit、competitor analysis、visual landscape、differentiation、white space、perceptual mapping、zig when others zag。
2026 年向けのエンタープライズ Android/Kotlin スキル——Kotlin 2.x K2 コンパイラ、AGP 9、Navigation 3、エッジツーエッジ Compose、アトミックな _state.update による厳格な MVI、禁止された AI アンチパターン。Jetpack Compose、Hilt、Room、KMP、CameraX/ML Kit、パフォーマンス、テスト。Android 用の Kotlin を書くとき、Compose UI の構築、MVVM/MVI アーキテクチャ、リコンポジションのデバッグ、Room DAO、Navigation 3、コルーチン、または「structure Android app」「ViewModel UiState」「collectAsStateWithLifecycle」「edge to edge」「AGP 9」「K2 compiler」「Play Store release」について尋ねるときに使用。
メディア管理 MCP サーバーを使用して、高精細なビジュアル素材、ロゴ、UI モックアップを生成します。画像の生成、ロゴの作成、ヒーローバナーの制作、UI アイコンのデザイン、ビジュアル素材の作成をユーザーが求めた場合に、このスキルを起動します。ファイル形式(PNG、JPEG、WEBP)、指定サイズ(例:1024x1024)、透過要件などの技術仕様に対応するよう設計されています。生成画像をアプリケーションコードやウェブページに組み込む場合に使用します。出力品質を一定に保ち、生成ツールが利用できない場合は標準化された SVG の代替を提供します
UI/UX の実装、監査、デザインシステムの作業のために Figma のデザインコンテキストを読み取り要約する。ユーザーが Figma URL、選択した Figma ノード、フレーム、コンポーネント、Dev Mode コンテキスト、variables、library、スクリーンショットを提供し、Figma ファイルを変更せずに階層、レイアウト、トークン、コンポーネント、アセット、バリアント、インタラクションの注記、実装上の制約に関する構造化された事実を求める場合にこのスキルを使用する。
Figma フレームとデザインコンテキストを、実装可能なフロントエンド計画、コンポーネントマッピング、コードの引き継ぎに変換する。ユーザーが Figma フレームから構築したい、Figma コンポーネントとコードコンポーネントを比較したい、Code Connect を使いたい、ピクセル単位のコピーを避けたい、variables をトークンにマッピングしたい、あるいは作業が webapp-ui-skill、marketing-site-skill、ローカルコード実装のどれに属するかを判断したい場合にこのスキルを使用する。
HTML + CSS でプロフェッショナルにデザインされた B2B SaaS の電子書籍を作成し、印刷可能な PDF として書き出す。3〜10 ページ、9 種類のスタイルプリセット、11 種類のページレイアウト。ユーザーが "create an ebook"、"design a lead magnet"、"make a PDF guide"、"build a gated content piece"、"write a B2B ebook"、"design a white paper"、"create a nurture asset"、"make a PDF report" と言ったときにトリガーする。
完全な CSS テーマ、card-mod スタイル、button-card テンプレートを備えた、美しくコピー&ペーストでそのまま使える Home Assistant ダッシュボードデザイン。9 つの異なるビジュアルスタイル:Glassmorphism、Dark Minimal、Material You、Nordic、Neon/Cyberpunk、Warm Home、Soft Pastel、Luxury Gold、Retro Terminal。ユーザーがダッシュボードを良く見せたい、カードのスタイリング、Home Assistant の CSS、card-mod、button-card テンプレート、Lovelace テーマ、ダッシュボードの美しさについて尋ねる、または特定のビジュアルスタイルを求める場合はいつでもこのスキルを使用する — 「デザイン」や「CSS」という言葉を使わない場合でも。
Sass テーマシステムと igniteui-theming MCP サーバーを使って、カラーパレット、タイポグラフィ、elevation、コンポーネント単位のスタイルを含む Ignite UI for Angular のテーマを生成・カスタマイズする。使用する場合:ユーザーが Ignite UI コンポーネントのテーマ設定、再スタイル、スタイル設定を求めたり、色やカラーパレットの変更、ライトテーマとダークテーマの切り替え、グローバルテーマの作成・適用、タイポグラフィや elevation シャドウのカスタマイズ、スペーシング、サイズ、角丸の調整、コンポーネント単位のデザイントークンの設定を求めたりする場合。使用しない場合:コンポーネントの動作、API、データバインディング(igniteui-angular-components または igniteui-angular-grids を使用)。デザイン画像や Figma ファイルからビュー全体を構築する場合(igniteui-angular-generate-from-image-design または igniteui-angular-figma-to-app を使用)。
AI アプリケーションが外部のツールやデータソースに統一的な方法で接続するためのオープンなプロトコルです。クライアントはモデルとの対話を担い、MCP サーバーはツール・リソース・プロンプトテンプレートを提供します。標準メッセージでやり取りするため、1 つのサーバーを複数のクライアントで再利用できます。
