Skills
エージェント向けにパッケージ化された専門スキルと手順を 96,981 件掲載。コマンド 1 行でインストールできます。
デザイン・UI
ユーザー向けインターフェースの構築、実装、再設計、レビュー、改善では必ず使用します。HTML、CSS、Vue、Nuxt、React などのフロントエンドフレームワークで作成するページ、レイアウト、フォーム、ナビゲーション、ダッシュボード、再利用可能な UI コンポーネントが対象です。依頼が設計ではなく実装として表現されていても、レスポンシブデザイン、スタイリング、アクセシビリティ、視覚的階層、インタラクション状態、ユーザーエクスペリエンスに関わるフロントエンドコードの変更にも適用されます。ブラウザー検証には web-debug と併用してください。予期しない動作の根本原因調査にはデバッグを使用します。
ユーザーがブランド構築を依頼した場合、または以下の例に当てはまるタスクで使用します。アイデア、既存のウェブサイト、参考ブランドの一覧、商品写真、「X をリブランドしたい」といったあらゆる入力から、実用的なブランドアイデンティティを構築します。founder-kit ユーザーには、素早いクイックブランドの手順を既定とし、希望に応じて 14～16 ページの完全版ガイドラインを提案します。Shopify、商品掲載、ソーシャル投稿を含む完全なコマース立ち上げは必要とせず、ブランドアイデンティティを求める場合に使用します。起動フレーズ：「ブランドを作って」「ブランドアイデンティティをデザインして」「[X] のブランドガイドライン」「ブランドブックが欲しい」「ゼロからブランドを作成」「[アイデア] のブランド」「[X] と [Y] のような雰囲気のブランドが欲しい」「[対象] をリブランド」「[対象] のビジュアルアイデンティティ」「build-a-brand」。
アニメーショングラフィックのおおよそのアイデアを、自社ブランド Unemploymentで Claude Code 向けの正確な制作Briefに変換します。重要な要素（正確な数値、サイズ、長さ、ブランド）を先に確認し、実データとサンプルデータを区別し、数字を勝手に作りません。「このアニメーションのBriefを書いて」「モーションBriefがほしい」「投稿用にアニメーションのグラフを作りたい」「これを自社ブランドで動かしたい」という依頼や、アイデアはあるまだビルドプロンプトがない場合に使用します。
高級なフロントエンド画像指導スキル。プレミアム品質で、コンバージョン対応のウェブサイトデザインリファレンスを生成します。重要な出力ルール — 各セクションごとに 1 つの独立した横長画像を生成します。8 つのセクションを持つランディングページは 8 つの画像を生成します。複数のセクションを 1 つの画像に圧縮しないでください。構図の多様性（常に左テキスト/右画像ではない）、背景画像の自由度、異なる CTA、異なるヒーロースケール（巨大/中程度/ミニマリスト小）、ナラティブコンセプトスパイン、二次読み取りモーメント、すべての画像にわたって単一の一貫したパレットを強制します。ランディングページ、マーケティングサイト、開発者またはコーディングモデルが正確に再現できるプロダクトコンプ向けに最適化されています。
プレミアム、アプリネイティブなスクリーンコンセプトとフローを作成するための精選モバイルアプリ画像生成スキル。iOS、Android、およびクロスプラットフォームモバイル製品向けに設計されています。きれいな階層構造、読みやすいテキスト、強力なマルチスクリーン一貫性、制御されたカラーパレット、非ジェネリックなクリエイティブな方向性、テクスチャ表面、画像主導の構図、上品なカスタムアイコン、きれいな電話モックアップフレーミングを優先します。デフォルトでは、スクリーンは微妙なプレミアム iPhone または同様の電話モックアップ内に表示され、目に見えるフレームがあります。一方、メインのフォーカスはアプリコンテンツ自体に留まります。このスキルは画像のみを生成します。コードは記述しません。
このパック内の他のすべてのスキルが参照するセットアップステップです。短いインタビューと 3〜5 件の参照フレームから、プロジェクト内に 2 つのファイル brand.md（あなたが何者か、何を売るか、どの素材があるか）と MOTION.md（あなたの色、タイポグラフィ、タイミングとモーションのルール）が生成され、さらに CLAUDE.md に 1 条のルールが追加されて、Claude は何かをアニメーション化する前にこれらを読み込みます。モーションプロジェクトの開始時、あるいは「set up my brand」「brand intake」「build my motion design system」「make it look like my brand」「onboard me」「write my MOTION.md」と言われたとき、またはブランドフレームを一括でチャットに貼り付けたときに使用します。
構造、ビジュアルの方向性、階層、素材、開封体験を含むパッケージデザインブリーフを作成します。ユーザーが「packaging design」「packaging brief」「product packaging」「packaging direction」「label design」「packaging identity」「unboxing experience」「packaging look and feel」「brief my packaging designer」「packaging for my product」「packaging strategy」「retail packaging」「e-commerce packaging」「what should my packaging look like」と言った場合、またはデザイナー、代理店、メーカーにパッケージ要件を伝える場合に使用します。
ユーザーがApp Store画面を求める場合、または以下の例に当てはまるタスクで使用します。`brand.md`、製品の生スクリーンショット、またはPika MCPで取得した公開App Store掲載情報をもとに、指定ブランドのスタイルで5～6枚のApp Storeスクリーンショットを生成します。ストーリー性のある構成（フック→価値→機能→証明→締め）で、印象的かつブランドに沿ったデザインにします。App Store Connectにそのまま登録できる1290×2796のPNGを出力します。App Store／ストア掲載用素材を求める場合に使用します。例：「App Storeのスクリーンショットを作って」「[brand]のApp Store画面をデザインして」「brand.mdとスクリーンショットがあるのでストア素材を生成して」「アプリ公開用のスクリーンショット一式」「iOSストア画面」「App Storeのクリエイティブ」「ストア掲載用ビジュアル」「印象的なApp Store画面」「app-store-screens」。
記事、メモ、製品コンセプト、職場のレポート、クリエイターの投稿、チュートリアル、学校教材、人文系のテーマ、科学解説、スクリーンショット、グラフデータから、Guizang風のマテリアルイラスト、ラベル付き説明ビジュアル、マテリアルスタイルのグラフイラスト、データ重視のエディトリアル画像を生成します。ユーザーが挿絵、文字入りイラスト、説明図、図解イラスト、コンセプト分解図、グラフのブラッシュアップ、データ図のブラッシュアップ、3Dグラフ、報告用・コンテンツ用の画像、小学校教材の挿絵、生物/化学/物理の説明図、人文系の挿絵、プロセス/ループ/システム図を求める場合や、GPT-Image / 画像生成でソーシャルカード、ドキュメント、スライド、PPT、投稿に使える補助画像を作成したい場合に使用します。
Blazor アプリケーションに Ignite UI for Blazor Lite のコンポーネントサポートを追加、設定、またはレビューする。IgniteUI.Blazor.Lite または IgniteUI.Blazor.GridLite のインストール、Blazor Server、WASM、Hybrid、または split Blazor Web App プロジェクトでの AddIgniteUIBlazor() の登録、@using IgniteUI.Blazor.Controls の追加、テーマスタイルシートの接続、適切なホストページの選択、GridLite スタイルシートのパス特定、single-project と split Server/Client Web App のセットアップの違いの説明、Ignite UI コンポーネントが動作するための対話型レンダーモードが必要な場所の確認に使用する。Ignite UI を使わない一般的な Blazor コンポーネントの作成（create-blazor-project 参照）、アプリアーキテクチャやレンダーモードをゼロから選ぶこと（create-blazor-project 参照）、JavaScript 相互運用（use-js-interop 参照）、認証（configure-auth 参照）、プリレンダリング（support-prerendering 参照）、Ignite UI のセットアップが不要なレイアウト・コンポーネント設計の質問には使用しない。
codexthemes.ai から公開済みの Codex テーマをダウンロードし、ソースファイルをローカルの ~/.codexthemes テーマライブラリにインストールします。無料枠内で匿名利用するか、CodexThemes API キーを使って上限を引き上げられます。ユーザーが CodexThemes のテーマのインストール、ダウンロード、取得、試用を求める場合、インストールする codexthemes.ai のテーマ URL または ID を指定する場合、ダウンロードのレート制限に達して API キーの案内が必要な場合に使用します。
Wan および Qwen Image モデルを使って画像を生成・編集します。テキストからの画像生成、画像編集（スタイル転送、被写体の一貫性、テキスト描画）、テキストと画像の交互出力に対応します。起動条件：ユーザーがイラスト、商品画像、アートデザイン、ポスターの作成、テキストからの画像生成、既存画像の編集／変換、スタイル転送、参照写真に基づく画像生成、テキストと画像を組み合わせたコンテンツの作成を希望する場合、Wan/Qwen Image モデルや AI アート作成に言及する場合、またはこのスキル名を明示的に指定する場合（例：qwencloud-image-generation を使用）。起動しない条件：既存画像の理解／分析や OCR を希望する場合（qwencloud-vision を使用）、動画生成（qwencloud-video-generation）、テキストのみのタスク。
動画タイトルをもとに、ブランドに合わせた YouTube サムネイルを生成します。クリエイターの参考写真、高 CTR のサムネイル原則、ブランドカラーを使い、Gemini 用の画像生成プロンプトを作成します。ユーザーが「thumbnail」「youtube thumbnail」「build me a thumbnail」と言った場合や、台本を書く前に動画のカバー画像を作りたい場合に使用します。サムネイルを先に作るワークフローは、LinkedIn のビジュアル先行の手法と同様に、台本の内容を聞く前に動画をアピールします。
記事、ケーススタディ、ブランドストーリー、製品の歩み、または長編ストーリーを、次の 3 種類のレンダラーのいずれかを使ったシネマティックなスクロール駆動型ランディングページに変換します。スクラブ操作可能な動画、リアルタイムの Three.js ワールド、またはセマンティックな HTML/SVG のデータとタイポグラフィです。スクロールワールド、フライスルー型ランディングページ、記事からウェブサイトへの変換、アニメーションする惑星、データのスクロールストーリーテリング、動画スクラブページ、つながりのあるビジュアル体験、または一般的な縦積みセクションに代わるストーリー主導の構成を求められた場合に使用します
AI アプリケーションが外部のツールやデータソースに統一的な方法で接続するためのオープンなプロトコルです。クライアントはモデルとの対話を担い、MCP サーバーはツール・リソース・プロンプトテンプレートを提供します。標準メッセージでやり取りするため、1 つのサーバーを複数のクライアントで再利用できます。