Skills
エージェント向けにパッケージ化された専門スキルと手順を 96,770 件掲載。コマンド 1 行でインストールできます。
デザイン・UI
ユーザーがウェブサイトや Web UI を設計・構築したい場合にこのスキルを使用します。トリガー — 次のようなリクエストで有効化します:- ランディングページ、マーケティングサイト、ポートフォリオ、SaaS フロントエンド - ダッシュボード、管理パネル、データ可視化 - Web アプリ、複数ページのサイト、コンポーネントライブラリ - 「ウェブサイトを作る」「ランディングページを作成」「UI をデザイン」「Web アプリを作る」「ポートフォリオを構築」「このページを再設計」といった表現 - 主な成果物がブラウザで表示される視覚的インターフェースであるあらゆるタスク 動作 — このスキルは完全で本番品質の Web 出力を生成します:- モバイル、タブレット、デスクトップに対応するレスポンシブレイアウト - アクセシビリティを備えたセマンティック HTML5(ARIA、コントラスト、キーボードナビゲーション)- Tailwind またはバニラ CSS によるモダンなスタイル — アニメーションとトランジションを含む - インタラクティブな React またはバニラ JS コンポーネント - 一貫したデザインシステム:タイポグラフィ、カラートークン、余白、アイコン - プレースホルダーや TODO はゼロ — すべてのセクションを完全に実装 次にはトリガーしません:バックエンドロジック、REST/GraphQL API、データベーススキーマ、CLI ツール、スクリプト、または出力がブラウザ UI でないあらゆるタスク。視覚的な Web 成果物が期待される場合は、汎用的なコーディングスキルより優先します。
Windows Forms アプリケーションの構築、保守、モダナイズを、デザイナー駆動の UI、イベント処理、データバインディング、MVP の分離、モダン .NET への移行に関する実践的なガイダンスとともに行う。USE FOR: Windows Forms UI、イベント駆動ワークフロー、クラシックな LOB アプリケーションの作業;WinForms を .NET Framework からモダン .NET へ移行;肥大化したフォームコードの整理。DO NOT USE FOR: 無関係なスタック;この特定のガイダンスを必要としない汎用タスク。INVOKES: リポジトリのコンテキストを調査し、対象ファイルを編集し、変更時に該当するビルド、テスト、lint、検証コマンドを実行する。
Yuval Avidani の YUV.AI ブランドおよびデザインシステム。YUV.AI ブランドの出力が要求された場合にのみ適用する — プレゼンテーション、デッキ、基調講演、ポートフォリオ、ブランドサイト、プロフィール、登壇者プロフィール、ブランドアセット、または YUV.AI / "my brand" / "my deck" / "my site" / "for me" に言及するプロンプト。YUV.AI の文脈がない一般的な "build a game / web app / dashboard / landing page" では自動的にトリガーしない — それらは合う任意のパレットを使う。3 つのモード;NEON(ホットピンク #FF1464 + ネオンシアン #00E5FF + 白、YUV.AI の Web、アプリ、ゲーム、ダッシュボード、ソーシャル、一般的なビジュアル制作のデフォルト);DECKS(Fly High の紫/黄/グレー、プレゼンテーションとスライドのみ);Warm Editorial(ピンク/黄/ボーン、Hope、Marcus、bigcats.ai、practical.yuv.ai 用)。すべてのモードに共通する Fly High の一貫した流れ;飛行/進捗のモチーフ(HUD ストリップ、ダイヤル、"Let's Fly High" のタグライン、フェニックスのマーク)。Anton + Inter(英語)、Rubik + Assistant(ヘブライ語)、letter-spacing はデフォルトで 0。同梱のブランドアセット、正規のソーシャル、資格情報。プロジェクトのブランドが指定された場合はそちらが優先される。
アクセシビリティを後付けの確認ではなく、構築プロセスに組み込みます。セマンティックHTMLを優先し、キーボード操作順とフォーカス管理、視認できるフォーカス、すべてのコントロールへの名前付けを行い、HTMLで対応できない場合に限りARIAを使用します。ライブリージョン、モーション抑制、コントラスト、タップ領域のサイズ、ラベルとエラーが関連付けられたフォーム、見出しとランドマーク、操作不能レイヤー、200%ズーム、スクリーンリーダーで5分以内にテストする方法を扱います。インタラクティブUIの構築、アクセシビリティ対応の依頼、レビューでのアクセシビリティ確認に使用します。
ユーザーが "motion graphics"、"motion design"、"title sequence"、"kinetic typography"、"explainer animation"、"motion branding"、"animated logo"、"lower thirds"、"broadcast design"、"After Effects"、"act as a motion graphics designer"、"motion graphics mode"、"animation principles"、"ease curves"、"timing and spacing"、"transition design"、"animated infographic"、"intro animation"、"outro animation"、"bumper"、"ident"、"stinger"、"lyric video"、"animated social media"、"loop animation"、"GIF design" について尋ねた場合、またはタイトルシーケンス、解説アニメーション、キネティックタイポグラフィ、モーションブランディングの設計に関する専門知識が必要な場合にこのスキルを使用します。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 のデザインガイダンスに対応します。
axe-core —— 自動化された WCAG 準拠チェックのためのアクセシビリティテストエンジン。使用場面:ユーザーが "axe"、"automated accessibility testing"、"a11y tests" に言及する、または "integrating accessibility checks"、"CI/CD accessibility"、"Playwright accessibility"、"Jest accessibility"、"Vitest axe" について質問する場合。使用しない場面:手動のアクセシビリティ監査——代わりに `wcag` skill を使用
デザインエンジニアリングの技巧と実行の卓越性。UI コンポーネント、ページ、インタラクションの構築、レビュー、リファクタリング、改善を行う際に適用される。トリガー:コンポーネントの構築、UI のスタイリング、アニメーション/トランジションの追加、デザイン品質のレビュー、フロントエンドコードのリファクタリング、hover/active/focus 状態の実装、影/色/グラデーション/間隔/タイポグラフィ/角丸の扱い、ドラッグインタラクション、レイアウトアニメーション、アイコンのトランジション、またはユーザーが「デザインエンジニアのように考える」ことを求める場合。技巧の全領域を網羅する:モーション、色、影、視覚的な整列、タイポグラフィ、間隔、グラデーション、パフォーマンス、ジェスチャー、マイクロインタラクション。
ウェブサイト、アプリ、プレゼンテーション、アニメーション、プロトタイプ、インフォグラフィック、ブランディングなど、あらゆるデザイン作業に対応する統合デザインスキルです。プロジェクトのビジュアルアイデンティティを確立または変更する際に、DESIGN.md(Google 形式)を作成または更新します。タスクに応じて cinematic-ui または practical エンジンに振り分けます。すべてのデザインタスクで必ず使用します。次の語句で必ず起動します:設計、design、原型、prototype、PPT、投影片、slides、動畫、animation、簡報、deck、landing page、website、UI、mockup、MP4、GIF、infographic、branding、logo、評審、critique、film-inspired、cinematic。
エディトリアルでミニマルなスタイルの、編集可能なビジネス向け PPTX デッキを作成します。白い背景、Georgia のセリフ体タイトル、赤いアクセントバー 1 本、全高の写真セクション区切りを使用します。HTML スライドから、ネイティブテキストボックスを備えた実際に編集可能な .pptx を出力します。このすっきりとしたエディトリアルスタイルまたは「写真区切り」スタイルのビジネスレポート、ピッチデッキ、PPT、PPTX をユーザーが求めている場合、またはこのスキルに言及した場合に使用します。
FineUI のフォームを開発者が使えるように支援する:Form / SimpleForm コンテナ、フォームフィールド(TextBox / TextArea / NumberBox / DatePicker / DropDownList / CheckBox / RadioButtonList など)、Calendar インラインカレンダー、フィールド単位およびフォーム全体の検証、フィールド値の読み取り。F.js(JavaScript)、Pro(WebForms)、FineUI.Core の MVC(Fluent API)/ RazorForms / RazorPages(TagHelper)、さらに FineUI.Java(Spring Boot + Thymeleaf 方言タグ、kebab-case)をカバー。トリガーフレーズ: "FineUI 表单", "F.Form", "SimpleForm", "FormRow", "表单校验", "ValidateForms", "Required", "TextBox", "NumberBox", "DatePicker", "DropDownList", "RadioButtonList", "CheckBox", "CheckBoxList", "TimePicker", "Label", "Hidden", "FileUpload", "TriggerBox", "DropDownBox", "HtmlEditor", "MarkInvalid", "字段标签", "LabelWidth", "读取表单值", "下拉树", "文件上传", "富文本编辑器", "Calendar", "内嵌日历", "日期范围", "月份选择", "年份选择", "时间选择", "OnDateSelect", "FineUI.Java", "Spring Boot", "Thymeleaf", "@FineUIPage", "text-box", "simple-form", "form-row".
FineUI のレイアウトシステム——コンテナの `Layout` プロパティが子コントロールをどのように配置するかを開発者に支援する:Fit(塗りつぶし)/ Region(上下左右中央の領域)/ HBox・VBox(フレックスボックス)/ Block(レスポンシブグリッド)/ Column / Anchor、およびビューポートへの適応(IsViewPort / AutoSizePanelID)。F.js、Pro、FineUI.Core(MVC/RazorForms/RazorPages)、FineUI.Java(Spring Boot + Thymeleaf 方言タグ、kebab-case、region-panel 便利コントロールを含む)をカバーする。 Trigger phrases(トリガーフレーズ): "FineUI 布局", "Layout", "Region 布局", "区域布局", "RegionPosition", "HBox", "VBox", "BoxFlex", "弹性布局", "Fit 布局", "Block 响应式", "BlockMD", "栅格布局", "IsViewPort", "视口自适应", "Column 布局", "Anchor 布局", "FineUI.Java", "Spring Boot", "Thymeleaf", "region-panel", "region-position", "box-flex", "is-view-port".
FineUI のウィンドウとメッセージボックスの使い方を開発者に支援する:Window(インラインコンテンツ / iframe ポップアップ)、ウィンドウの開閉、iframe 子ページから親ページへのデータ返却(closeArgument)、および MessageBox(Alert ダイアログ / Confirm 確認ボックス / Notify 通知ボックス)。 F.js(JavaScript)、Pro(WebForms)、FineUI.Core の MVC(Fluent API)/ RazorForms / RazorPages(TagHelper)、および FineUI.Java(Spring Boot + Thymeleaf 方言タグ、kebab-case)をカバーする。 Trigger phrases(トリガーフレーズ): "FineUI 窗口", "F.Window", "弹窗", "对话框", "MessageBox", "Alert.Show", "F.alert", "F.confirm", "确认框", "通知框", "Notify", "ShowNotify", "iframe 窗口", "关闭窗口", "回传数据", "closeArgument", "GetShowReference", "OnClose", "FineUI.Java", "Spring Boot", "Thymeleaf", "@FineUIPage", "f:window", "showAlert", "showNotify", "showConfirm", "ActiveWindow", "setHidden".
B2B SaaS の営業とマーケティング向けに、プロ品質でデザインされたケーススタディ PDF を生成する。7 種類のページレイアウト、9 種類のスタイルプリセット、1〜4 ページの出力に対応。ユーザーが「create a case study」「write a customer story」「make a case study PDF」「design a success story」「turn this customer win into a PDF」と言ったときにトリガーする。
「define our core action」「North Star metric」「accruing benefits」「improve retention mechanics」「hierarchy of engagement」「Sarah Tavel framework」と尋ねられた場合に使用します。消費者向け製品が、長期的な継続利用を促す行動と便益を特定するのに役立ちます。Benchmark の Sarah Tavel が作成した Hierarchy of Engagement フレームワークは、コアアクションから損失の拡大に至る進展を示します。
HTML 出力をデフォルトの AI スタイルではなくプロのコンサルティング成果物のように見せるデザインシステム。あらゆる HTML ドキュメント - レポート、分析メモ、提案書、調査サマリー、ダッシュボード、artifact - を生成するときは常に使用し、ユーザーが「HTMLで資料」「HTMLでまとめて」「レポートにして」「コンサル風に」「資料っぽく」「デザインがダサい」と言った場合や、既存の AI 生成 HTML のリスタイルを求めた場合にも使用。ボックス、罫線、グラデーション、emoji、虹色を、余白主体・タイポグラフィ優先・印刷対応(A4)のデザインに置き換える。
React Native および Expo アプリケーションで KorUI ライブラリ(@korsolutions/ui)を使用するための完全ガイド。KorUI でユーザーインターフェースを構築する、テーマをカスタマイズする、ライブラリをセットアップする、27 以上のコンポーネント(Button、IconButton、Input、Select、Checkbox、RadioGroup、Alert、Card、Separator、Tabs、Menu、Popover、Calendar、Toast など)のいずれかを扱う、スタイリングとテーマ化を行う、複合コンポーネントを実装する、コンポーネントの問題をデバッグする、あるいはユーザーが "@korsolutions/ui"、"KorUI"、"UIProvider" に言及したり、テーマのカスタマイズや React Native の UI コンポーネントについて尋ねたりしたときに、このスキルを使用する。このスキルは、インストール、Provider のセットアップ、コンポーネントの使用パターン、テーマのカスタマイズ、バリアントシステム、hooks、レスポンシブデザイン、トラブルシューティングを扱う。
@virtuoso.dev/message-list でチャット、メッセージング、AI 会話の UI を構築します。(1) チャットまたはメッセージング インターフェイスの構築、(2) AI アシスタントの応答を会話にストリーミング、(3) 上にスクロールしたときの古いメッセージの読み込み、(4) 最下部へスクロールするボタンや未読メッセージ インジケーターの追加、(5) チャンネル/会話間の切り替え、(6) VirtuosoMessageList、VirtuosoMessageListLicense、useVirtuosoMethods、useVirtuosoLocation、scrollModifier、notifyItemsChanged、scrollToBottomIfAtBottom、scrollToBottomAlways、スムーズスクロールの再ターゲット、置換アンカー、data.append/prepend/map/replace を含むタスクでこのスキルを使用します。このパッケージは商用であり、ライセンスキーが必要です。
AI アプリケーションが外部のツールやデータソースに統一的な方法で接続するためのオープンなプロトコルです。クライアントはモデルとの対話を担い、MCP サーバーはツール・リソース・プロンプトテンプレートを提供します。標準メッセージでやり取りするため、1 つのサーバーを複数のクライアントで再利用できます。
