Skills
エージェント向けにパッケージ化された専門スキルと手順を 96,981 件掲載。コマンド 1 行でインストールできます。
デザイン・UI
独自性のある本番向け Bagisto ストアフロントテーマを作成、再設計、拡張、デバッグ、検証、パッケージ化、テスト、アップグレードする。自己完結した Bagisto の UI/UX の方向性、徹底的に磨き上げたブランドとコマースのデザインシステム、デザイントークン、レスポンシブなストアフロント UX、初心者向けのガイド付き実装、Shop テーマ登録、リソースのオーバーレイ、配布可能なパッケージ、Blade レイアウト/コンポーネント、インライン Vue、Vite/Tailwind のアセット、管理画面で動的に制御されるコンテンツ、チャネルとテーマカスタマイズのコンテンツ、ローカライズ/RTL、アクセシビリティ、パフォーマンス、完全な Playwright によるコマースのカバレッジ、デプロイ、またはテーマの継承とアセットマニフェストの失敗の解決に使用する。すべての識別子、パス、バージョン、コンポーネント、ロケール、コマンドは対象のチェックアウトから導出する。
ユーザーが提供した記事、ノート、チュートリアル、SOP、チェックリスト、Web コンテンツ、ローカル文書を分解し、小紅書(Xiaohongshu)の 3:4 複数ページ画像テキスト HTML にレイアウトします。既定では 6 枚以上の 1080×1440 ページを含み、ページごとにスクリーンショットできる完全な自己完結型 HTML を生成します。62 種類のブランドデザインスタイルに対応し、作業前にマッチするスタイル候補と 6/7/8/9 枚のページ数案をユーザーに提示して選択してもらいます。「小紅書の画像テキストを作る」「内容を小紅書カードに変換する」「複数ページの小紅書 HTML を生成する」「3:4 のナレッジカードを作る」「記事を小紅書の画像セットにレイアウトする」「チュートリアル画像テキストを作る」「スクリーンショット可能な HTML を作る」といったリクエストに適しています。
AI エージェント向けのインフォグラフィックスキル。Claude Code、Codex、Hermes、OpenClaw、Cursor、および skills を読み込むあらゆるエージェントホスト内で動作する。プロフェッショナルなインフォグラフィックを自己完結型の HTML ファイルとして作成し、PNG エクスポートに対応。ユーザーがインフォグラフィック、データ可視化、ビジュアル解説、チャートポスター、チートシート、ポケットガイドの作成、設計、生成、構築、または作成を求める場合に使用。トリガーフレーズには "make this visual"、"turn this into a graphic"、"visualize this data"、"infographic for X"、"cheatsheet for X" が含まれ、またはユーザーが構造化データ(トークノミクスの配分、エコシステム/パートナー一覧、タイムライン、比較、ステップバイステップのプロセス)を提供し、かつ視覚的出力を求める場合に使用。トークノミクス、エコシステム概要、ゲーム概要、チートシート、エアドロップガイド、比較、プロセスフローを扱う。プレーンテキストの回答、markdown テーブル、箇条書きの要約、トピックに関する助言や説明を求める質問(トピックがトークノミクス、エコシステム、ベスティングなどであっても)、インラインチャットの図、視覚的出力を求めないデータ処理にはトリガーしない。シグナルは「視覚表現を求める」ことであり、「キーワードに言及する」ことではない。
ユーザーが「typography」「type design」「font selection」「font pairing」「typographic hierarchy」「typographic grid」「type scale」「readability」「legibility」「kerning」「leading」「tracking」「typeface classification」「serif vs sans-serif」「modular scale」「act as a typographer」「typographer mode」「type system」「web typography」「variable fonts」「responsive typography」「paragraph spacing」「baseline grid」について尋ねる場合、または書体の選定、タイポグラフィの階層設計、フォントの組み合わせ戦略、可読性の最適化に関する専門知識が必要な場合に、このスキルを使用します。AlterLab FC Skills コレクション(VCD 部門)の一部です。
Apple の現行デザイン言語(Human Interface Guidelines + Liquid Glass、2026 年半ば)を、あらゆる UI 作業に適用します。iOS/iPadOS/macOS スタイルのアプリインターフェースや、Apple.com スタイルのマーケティング/ランディングページ(大きな見出し、明暗セクションの交互配置、スクロール連動の商品紹介)が対象です。ユーザーが「Apple style」「Apple-like」「HIG」「iOS style」「macOS style」「Liquid Glass」「iOS 26 style」「Cupertino」「clean premium minimal」なランディングページ、または iPhone/Mac の発表ページのような商品ページを求めた場合に使用します。「Apple」と明言していなくても、すりガラス、フローティングタブバー、ピル型ボタン、大きく中央揃えした見出し、スクロールに連動する商品アニメーションについて説明している場合も対象です。Apple プラットフォームへの適合性についてデザインをレビュー/批評する場合にも使用します。HTML/CSS/JS のプロトタイプ、React + Tailwind、Figma のデザインガイダンスに対応します。
ユーザーが Claude から OpenAI Codex に画像を送りたいとき——既存のスクリーンショット/モックアップ/ワイヤーフレームを Codex 側でレビューする、Codex の image_gen ツールで画像を生成する、Codex 経由で既存の画像を編集する——、または "codex-vision" / "/codex-vision" を明示的に呼び出すときに使用する。上流の `codex exec -i` CLI をラップし、3 つのモード(review / generate / edit)と、オプトインの tmux セッション(`claude-codex-` を接頭辞とする)を提供して、ユーザーがアタッチして観察できるようにする。タスクがテキストのみの場合、または永続的なマルチターンのリポジトリ作業が必要な場合はスキップする——長時間実行される画像+コーディング作業には codex-tmux-dev を使用する。単なる "codex" という語はトリガーではない。単なる "screenshot" という語はトリガーではない。generate/edit では、ユーザーがスキルを名前で呼び出していない限り、明確な Codex の意図を必要とする。明示的な `/codex-vision` の呼び出しは、以下の他のすべてのゲーティングルールを上書きする。
現実世界のたとえ、視覚的な図、段階的な開示を通じて複雑な概念を説明する、アニメーション付きのインタラクティブな HTML ページを生成する。ユーザーが「explainer infographic」「X の仕組みを説明して」「〜の解説図を作って」「この概念を可視化して」「これをビジュアルにして」「X をビジュアルで理解したい」と言ったとき、またはトピックを簡潔なビジュアル形式で分解するよう求めたときに使用する。出力は単一の自己完結型 HTML ファイルで、ユーザーはブラウザで開いたり、スクロールして閲覧したり、リンクとして共有したりできる。トピックは何でもよい——金融の概念、技術システム、科学的プロセス、ビジネスフレームワーク。
コンテンツ、参考資料、既存の SVG、またはライブボードから、意図的に設計された編集可能な Feishu / Lark ホワイトボードを構築、修正、再スタイル設定、批評する。事実の忠実性、強い階層構造、意図的な構図、そして均等なカードの汎用グリッドではなく証拠に基づくレビューを必要とするホワイトボード、インフォグラフィック、図、システムマップ、タイムライン、意思決定ボード、ポスター、ビジュアル解説に使用。作成、修正、批評を別々のプレイブックに振り分ける。描画前にコンテンツとデザインの契約を確定する。確定的な SVG の欠陥を検証する。実際の成果物をレンダリングして検査する。重要な納品物には独立した最終レビュアーを使用する。
これまでデザインシステムを持たなかった vibe-coded の本番アプリからデザインシステムを抽出します。コンポーネントを棚卸しし、事実上のスタイルを DTCG トークンとして掘り起こし、Storybook パッケージを足場組みし、コンポーネントを移植し、必要に応じてトークン/コンポーネントを Figma にラウンドトリップします。「デザインシステムを抽出する」「このアプリ/コードベースからデザインシステムを作る」「私たちのコンポーネントを Storybook にリバースエンジニアリングする」「アプリのスタイルをトークンにする」「複数の AI 製プロダクトの UI を統合する」といった要望で使用します。figma-console-mcp ローカルサーバー(figma_ds_* ツール)に接続していると最もよく機能します。エージェント駆動のフォールバックも含みます。
ClientApp の Svelte 5 アプリのフロントエンド入口としてこのスキルを使用する。ルートの追加、フィーチャースライスの作成、Svelte コンポーネントの記述、TypeScript 規約の適用、共有 UI/フォーマッターコンポーネントの使用、アクセシビリティの対応、フロントエンドテストの追加に用いる。レガシーの Angular アプリは ClientApp.angular で現在のサイトの大部分を依然として支えているが、ユーザーが明示的に Angular やレガシー UI の変更を求めない限り、新しいフロントエンド開発はすべて Svelte UI のみで行うべきである。
フロントエンドのビジュアル再現スキル。Playwright MCP または agent-browser を使って対象サイトの公開ページを調査し、スクリーンショットとレイアウト情報を取得したうえで、元のビジュアルとページ構造を近似する静的またはクライアントサイドのフロントエンド複製を生成します。このスキルが再現するのはフロントエンドの表示のみです。バックエンドロジック、サーバーサイドの動作、データベース、非公開コンテンツは再現しません。ウェブサイトを複製する前に、適切な権限(所有権、ライセンス、または明示的な許可)があることを確認する責任はユーザーにあります。権限確認:開始前に、エージェントは対象サイトを複製する法的権利があることを必ずユーザーに確認しなければなりません。確認できない場合、スキルは必ず処理を拒否します。
あらゆる教科の知識ポイントを縦長の教育インフォグラフィック(9:16)に変換します。ユーザーは知識ポイントの名前(「音現象」「ピタゴラスの定理」「光合成」など)を入力するだけで、Skill が自動的に:教科/学年/章の識別、3〜5 個の核心サブ概念への分解、テーマカラー体系の割り当て、各サブ概念の具体的な挿絵記述の生成、完全なプロンプトの構築、linyuebanzi-image-gen の呼び出しによる画像生成を行います。二層の教科正確性チェックを内蔵:生成前に教科別チェックリストでプロンプトを自己点検し、生成後に PNG を読み戻して視覚的に再確認(文字/数式/図示)し、不合格の場合は自動的に再試行して、生徒に届ける内容の正確性を確保します。物理(音/光/熱/力/電気/レンズ/機械運動)、数学、化学、生物、国語、歴史、英語などの教科の挿絵ガイドラインを内蔵。バッチ生成に対応——「中 2 物理の前期全章」は章ごとに生成され、各章で異なる色体系、スタイルは統一されます。トリガーワードには以下が含まれます:インフォグラフィックを作る、ナレッジカード、教科図解、物理インフォグラフィック、化学インフォグラフィック、ナレッジ図を作る、ナレッジカードを描く、この知識ポイントを図にする。動的なインタラクティブデモ(インタラクティブデモ Skill を使用)、記事のカバー画像(linyuebanzi-cover-generator を使用)、手描き風の記事挿絵(linyuebanzi-inline-diagram を使用)には使用しないでください。
JSON 設定から、ターミナル風で常時動作するアニメーションアーキテクチャ図(「ライブパネル」)を構築し、mp4 にレンダリングします。固定レイアウト、配線上を光りながら流れるパケット、スクロールするログ、数値カウンター、状態が切り替わるバーを備えた、ターミナルウィンドウ内の監視ダッシュボード風のシステム、エージェント、組織のアーキテクチャ図を、静止画や段階表示ではなく、画面録画風動画またはライブウェブページにしたい場合に使用します。中文:当用户要做"活的"架构图、agent 树或系统监控面板风格的动画(mp4 视频或循环网页)时使用——终端里一直在跑的监控面板外观,固定布局、线上流动的数据包、滚动日志、翻转的计数器和状态条;不是静态图,也不是分步演示。
工業 HMI の慣例(ISA-101 準拠)に従い、MATLAB で産業グレードの SCADA/HMI ダッシュボードを構築する:グレーフィールドの考え方、発生源でのアラーム、書き込み保護、固定レンジのトレンド、ドリルダウン レイアウト。利用可能な場合はシリアル化を matlab-build-app スキルに委ねることで実際の App Designer アプリ(.mlapp、または R2026b+ ではプレーンテキストの .m+.xml)を生成し、そうでない場合はプログラムで生成する .m アプリにフォールバックする。OPC UA / Modbus / MQTT / OSI PI / PI AF の監視スクリプトをライブのオペレーターアプリにまとめる場合、プラント概要の構築、オペレーター ダッシュボードの設計、または MATLAB で "SCADA dashboard"、"HMI"、"plant dashboard"、"operator screen"、"industrial monitoring app" を求められたときに使用する。トリガー:SCADA、HMI、industrial dashboard、plant overview、operator screen、uigauge、uilamp、alarm banner、gray-field、ISA-101、OPC UA dashboard、setpoint、write safeguards、alarm visualization、OSIsoft PI、AVEVA PI、PI Server、PI Data Archive、PI AF、PI Asset Framework、piclient、afclient。
スマートフォンでWebインターフェースをネイティブアプリのように感じられるようにします。タッチターゲット、動的なビューポート高さ、安全領域、タップ時のハイライトと固定ホバー、入力時のズーム、touch-actionとoverscroll、親指の届く範囲に配置するシートやボトムバー、画面キーボード、慣性スクロールとプルリフレッシュの競合、中程度の性能のデバイスでのパフォーマンスを扱います。モバイルでサイトが「いかにもWebサイトらしく感じる」場合、ボトムシート、ボトムナビゲーション、モバイルフォームを構築する場合、またはスマートフォン向けのものをリリースする前に使用します。
ひとことの意図から、洗練された完成度の高いモーションを作成します。「見栄えのよいアニメーション付きランディングページを作って」「楽しい「いいね」アニメーションを追加して」「滑らかなリリース動画を作って」といった自然言語の依頼を受けると、意図を分類し、MOTION-SPEC.md(タイミング、イージング、抑制の予算)に従いながら motion-anything ライブラリから最適なレシピを選んで出力します。motion-anything の汎用エントリーポイントです。ウェブページ、スライド、アプリ紹介ページ、動画に対応します。
AI アプリケーションが外部のツールやデータソースに統一的な方法で接続するためのオープンなプロトコルです。クライアントはモデルとの対話を担い、MCP サーバーはツール・リソース・プロンプトテンプレートを提供します。標準メッセージでやり取りするため、1 つのサーバーを複数のクライアントで再利用できます。
