mcpField

Skills

エージェント向けにパッケージ化された専門スキルと手順を 96,981 件掲載。コマンド 1 行でインストールできます。

デザイン・UI

S
slide-excellence
slide-excellence
pedrohcgs / claude-code-my-workflow

複数エージェントによる包括的なスライドレビュー(ビジュアル + 教育設計 + 校正、加えて条件付きで TikZ / 整合性 / 内容の実質性)。ユーザーが "full review"、"excellence pass"、"comprehensive check"、"review everything"、"pre-release review"、"slide excellence" と言った場合、またはデッキを教示 / 出荷する前に使用する。ファンアウト型ラッパー——単一の観点のみが必要な場合は `/visual-audit`、`/pedagogy-review`、`/proofread` を直接使用する。

ドキュメント55
S
Social Media Designer
eddiebe147 / claude-settings

各プラットフォームに最適化されたソーシャルメディア用グラフィックを作成します

デザイン・UI55
S
spark-app-template
spark-app-template
github / copilot-plugins

技術スタック、デザインシステム、コード標準について明確な既定値を示し、Web アプリの構築を包括的に支援する。ユーザーが新しい Web アプリ、ダッシュボード、インタラクティブなインターフェースを作成したいときに使用する。技術選定、スタイリングの指針、プロジェクト構成、デザイン哲学を提供し、機能的で美しい Web アプリを素早く立ち上げられるようにする。

開発55
S
swiftui-ui-patterns
swiftui-ui-patterns
dagba / ios-mcp

SwiftUI のビューとコンポーネントを構築するためのベストプラクティスと例題主導のガイダンス。SwiftUI UI の作成やリファクタリング、TabView によるタブ構成の設計、画面の組み立て、コンポーネント固有のパターンや例が必要なときに使用する。

デザイン・UI55
S
syncfusion-aspnetcore-calendars
syncfusion-aspnetcore-calendars
syncfusion / aspnetcore-ui-components-skills

Calendar、DatePicker、DateRangePicker、DateTimePicker、TimePicker を含む Syncfusion ASP.NET Core カレンダーコンポーネントを実装するための包括的なガイド。ユーザーが Syncfusion ASP.NET Core のカレンダー、日付ピッカー、日付範囲ピッカー、時刻ピッカー、日時ピッカー、カレンダービュー、複数選択、イスラム暦、日付範囲の制限、週番号、日セルのカスタマイズ、renderDayCell、日付選択、範囲選択、日付の書式設定、日付マスク、グローバリゼーション、ローカライズ、厳格モード、アクセシビリティ、または ASP.NET Core タグヘルパーアプリケーションにおける関連するカレンダー/日付/時刻 UI について質問した場合は、常に直ちにこの skill を使用する。

開発55
S
syncfusion-flutter-chat
syncfusion-flutter-chat
syncfusion / flutter-ui-components-skills

Flutter アプリの会話型インターフェース向けに Syncfusion Flutter Chat(SfChat)と AI AssistView(SfAIAssistView)ウィジェットを実装します。メッセージバブル、コンポーザー、アクションボタンをサポートするチャット UI、AI チャットボットインターフェース、メッセージ画面を構築する場合に使用します。この skill は、会話エリアのカスタマイズ、プレースホルダー画面、テーマ設定、RTL サポート、AI アシスタントの統合を扱います。

開発55
S
syncfusion-flutter-datagrid
syncfusion-flutter-datagrid
syncfusion / flutter-ui-components-skills

Flutter アプリケーションで表形式データを表示・操作するための Syncfusion Flutter DataGrid(SfDataGrid)を実装します。syncfusion_flutter_datagrid パッケージを使用してデータグリッド、データテーブル、列ベースのデータ表示を扱うときに使用します。このスキルは DataGridSource、GridColumn の構成、並べ替え、フィルタリング、ページング、編集、選択を扱います。

開発55
S
syncfusion-javascript-appbar
syncfusion-javascript-appbar
syncfusion / javascript-ui-controls-skills

ナビゲーションバー、アプリヘッダー、UI ツールバー向けに Syncfusion TypeScript AppBar コントロールを実装・構成する方法を学ぶ。このスキルでは、レスポンシブな配置、カラーモード、サイズ設定、スタイル、コンポーネント統合を扱う。柔軟なレイアウトとスタイルのオプションを必要とするナビゲーションソリューションを構築する場合に使用する。

デザイン・UI55
S
syncfusion-javascript-avatar
syncfusion-javascript-avatar
syncfusion / javascript-ui-controls-skills

ユーザー表現のための Syncfusion TypeScript Avatar コンポーネントを実装する。ユーザープロフィールの表示、さまざまな形状(円形または矩形)のアバター、カスタムサイズ、メディア形式(画像、SVG、アイコン、文字)、色のカスタマイズ、または Badge や ListView などの他のコントロールとのアバター統合が必要な場合に使用する。

デザイン・UI55
S
syncfusion-javascript-breadcrumb
syncfusion-javascript-breadcrumb
syncfusion / javascript-ui-controls-skills

ナビゲーション用の Syncfusion TypeScript Breadcrumb コンポーネントを実装・構成する方法を学ぶ。Web アプリのパンくずナビゲーションを実装する場合にこのスキルを使用する。コンポーネントの初期化、項目構成、オーバーフロー処理、イベント管理、高度なカスタマイズを扱う。

デザイン・UI55
S
syncfusion-javascript-stepper
syncfusion-javascript-stepper
syncfusion / javascript-ui-controls-skills

Syncfusion TypeScript Stepper ナビゲーションコンポーネントを作成・実装する。ステップ付きの進捗インジケーターの表示、ウィザード ワークフローの実装、多段階プロセスの表示、フォームページ間のナビゲーションの表示、ステップ検証の追加、ステップバイステップのガイド体験の構成を行いたい場合にこのスキルを使用する。Stepper コントロール、ステップ構成、方向、イベント、アニメーションを扱う際は必ずこのスキルを参照する。

デザイン・UI55
T
tailwindcss-typography
tailwindcss-typography
fusengine / agents

フォントファミリー/サイズ/ウェイトの設定、テキストの整列や折り返し(balance/pretty)、text-shadow や装飾の適用、字間/行間の設定時に使用します。

デザイン・UI55
T
tailwindcss-typography
tailwindcss-typography
fusengine / claude-plugins

認知的自動化と協調型エージェントシステムによって、開発を再定義します。

デザイン・UI55
T
threejs-fundamentals
threejs-fundamentals
akillness / jeo-skills

Three.js シーンの基盤を構築・デバッグします。レンダラー設定、カメラ、シーングラフ、トランスフォーム、リサイズ処理、カラーマネジメント、レンダーループ、リソースの破棄。Three.js シーンの作成、カメラやレンダラーの選択、座標空間や階層のバグ修正、信頼できる WebGL canvas の基盤構築を行う際に使用します。トリガー:three.js scene、WebGLRenderer、PerspectiveCamera、OrthographicCamera、Object3D、scene graph、camera setup、resize canvas、render loop、coordinate system、transform。

開発55
T
travel-photo-abstraction
travel-photo-abstraction
evianis / travel-photo-abstraction

ユーザーがアップロードした写真を分析し、その視覚的根拠を分解し、本質的な関係を抽象化・抽出したうえで、同梱の 19 件の参考資料に導かれて新しい非具象の下段パネル構成として再構築する。下段パネルに番号、日付、短いフレーズを配した CLEAN な上段写真/下段抽象のエディトリアル作品に使用する。これは抽象化と再構築であり、スタイル変換や縮小模写では決してない。上段にはユーザーがアップロードした写真をそのまま保持する。

クリエイティブ・メディア55
T
typo3-records-list-types
typo3-records-list-types
dirnbauer / webconsulting-skills

TYPO3 v14 の Records モジュールのリストタイプとカスタムバックエンドビューを構成する。グリッド、コンパクト、teaser、カンバン風、タイムライン風、TSconfig、Fluid テンプレート、アイコン、アクセシビリティを含む。レコードのリストタイプ、バックエンドのレコードカード、カスタム Records モジュールビュー、グリッドビュー、コンパクトビュー、teaser ビュー、TSconfig 駆動のレコード表示についてユーザーが言及したときに使用する。

開発55
U
ui-craft
ui-craft
mofirojean / angular-ui-skills

横断的な 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 と組み合わせる。

デザイン・UI55
U
ui-layout-analyzer
ui-layout-analyzer
yangsonhung / awesome-agent-skills

UI のスクリーンショットを分析し、レイアウト構造とインターフェースの機能を記述するときに使用する。

デザイン・UI55
U
unity-ui-procedural
unity-ui-procedural
muharremtozan / unity-agent-skills

UI Builder ではなく C# コードを使った高度な UI 構築。流暢な拡張メソッドと再利用可能なポインターマニピュレーターを含みます。

開発55
U
user-discovery-research
user-discovery-research
pluginagentmarketplace / custom-plugin-product-manager

ユーザーリサーチの手法、顧客インタビュー、ペルソナ開発、ジャーニーマッピングを習得する。構築する前に顧客の問題を深く理解する。

デザイン・UI55
U
ux-feedback
ux-feedback
sickn33 / agentic-awesome-skills

コンポーネントまたはページに適切なユーザーフィードバック状態(読み込み、成功、エラー、空)を追加

デザイン・UI55
V
v0
v0
headline-design / design-craft

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 の主張の強いデフォルトを体系化したもの。

デザイン・UI55
V
video-to-landing-page
video-to-landing-page
hoodini / ai-agents-skills

任意の動画をシネマティックなスクロール駆動のランディングページに変換する——スクロールに合わせて表示フレームが動画内を進む Apple 風のヒーロー。ユーザーが動画ファイルを提供し、「この動画からランディングページを作って」「スクロールフレームのサイト」「Apple 風のスクロールサイト」「動画をスクラブするヒーロー」「GitHub Copilot のランディングページのように」または同等の依頼をしたときに使用。ffmpeg で等間隔の N フレームを抽出し、スティッキーヒーロー + スクロールに応じて表示フレームを差し替える JS スクロールリスナーを含む自己完結型の HTML ページを構築し、その下に見出し、セクション、CTA を配置する。YUV.AI プロジェクトでは yuv-design-system スキルを Neon モード(ピンク/シアン/白、YUV.AI ウェブのデフォルト)で適用する——Decks(紫/黄)はスライド専用。汎用 / 非 YUV.AI プロジェクトでは、ソース動画に応じて適切なパレットを選ぶ。出力は `index.html` と `frames/` ディレクトリを含む 1 つのフォルダ——任意の静的ホストに置くだけ。

デザイン・UI55
V
visual-and-observational-rules
visual-and-observational-rules
oimiragieo / agent-studio

ゲームの視覚的側面と、プレイヤーが世界をどのように観察するかを定義する。マップの配色、スクリーンエフェクト、全体的なシミュレーションスタイルを含む。

デザイン・UI55
V
visual-reference-calibration
visual-reference-calibration
aa-on-ai / agentic-design-system

望ましいビジュアルリファレンスを解釈し、その意図された構図、マテリアル、またはインタラクションを既存のプロダクトに保持する。不具合の特定のためだけに提供されたスクリーンショットは対象外とする。

デザイン・UI55
W
web-design-guidelines
web-design-guidelines
lotfb86 / web-design-skills

Web インターフェースガイドラインへの準拠についてUI コードを確認します。「UI をレビューしてください」「アクセシビリティをチェックしてください」「デザイン監査」「UX をレビューしてください」または「ベストプラクティスに照らしてサイトをチェックしてください」と求められた場合に使用します。

デザイン・UI55
W
webflow-dev
webflow-dev
pointdotcom-marketing / marketing-skills

提供されたデザインから Webflow ページを構築・修正する際に、サイト既存のクラス、コンポーネント、アセット、レスポンシブパターン、インタラクションを再利用する。デザインから Webflow への実装、セクションの再構築、レスポンシブの一致作業、既存サイトが実装システムでありデザインが視覚的な唯一の正である場合の Webflow クリーンアップに使用する。

デザイン・UI55
W
wechat-styler
wechat-styler
zjp1997720 / content-twin-toolkit

Markdown 記事を WeChat 公式アカウントで使えるインラインスタイルの HTML に変換する。既定では kami の紙風テーマを使用し、kami、magazine-ink、magazine-indigo、magazine-forest、magazine-kraft、magazine-dune、elegant、modern、minimal の複数テーマ切り替えと、フォント、文字サイズ、アクセントカラー、背景色、出力パスなどのパラメータ設定に対応。公式アカウントの組版、記事 HTML の生成、不安定な外部組版サービスの代替に用い、特に本 vault 内の記事を WeChat 公式アカウントのエディタに貼り付けられる形式へ変換するのに適している。

デザイン・UI55
W
world-build
world-build
aa-on-ai / agentic-design-system

ユーザーが明示的に求めたときに、没入感のある世界、雰囲気、またはナラティブ体験を形作る。通常のプロダクト UI、ダッシュボード、フォーム、ドキュメントでは使用しない。

クリエイティブ・メディア55
1
1k-ui-recipes
1k-ui-recipes
onekeyhq / app-monorepo

参照専用の UI 回避策レシピのカタログ。自動ロードしないこと —— ユーザーが「1k-ui-recipes」または特定のレシピを名前で明示的に要求した場合にのみ呼び出す(iOS タブバーのスクロールオフセット、startViewTransition、折りたたみタブの横スクロール、Android 下部タブのタッチ傍受、キーボード回避、iOS オーバーレイナビゲーションのフリーズ、web keyboardDismissMode、iOS モーダル Fabric フレームアニメーション、Android バックグラウンドスレッドのタイマー/マイクロタスク)。

開発54
A
accessibility
accessibility
connorads / dotfiles

スクリーンリーダーを最優先する視点で Web アクセシビリティを監査、実装、修正する。UI コンポーネント、フォーム、ダイアログ、ナビゲーション、動的コンテンツ、その他のインタラクティブ要素を構築またはレビューするときに使用。WCAG 2.2 AA 準拠、ARIA パターン、キーボードナビゲーション、フォーカス管理、支援技術との互換性(NVDA、JAWS、VoiceOver)を扱う。次の場合にトリガー:"accessible"、"a11y"、"screen reader"、"WCAG"、"ARIA"、またはインタラクティブな UI を追加するとき。

デザイン・UI54
A
accessibility-review
accessibility-review
richtabor / agent-skills

WCAG 2.1/2.2 AA に基づいて UI のアクセシビリティ問題をレビューする。「これはアクセシブルか?」「アクセシビリティを確認して」、コントラスト/a11y レビューの依頼でトリガーされる。

テスト・品質54
A
ai-slop
ai-slop
waybarrios / opencode-power-pack

「AI slop を作るな」を、インターフェース設計における観察可能な特性、深刻度レベル、証拠要件、修正アクションに変える運用ルーブリック。マーケティングサイト、製品インターフェース、ダッシュボード、ポートフォリオ、EC ページを構築またはレビューする際の参照ルーブリックとして、特に frontend-design と併用する。

デザイン・UI54
A
art-director
art-director
hcaiano / skills

実装前にビジュアルの方向性を検討して選択する。

デザイン・UI54
A
avonni-architect
avonni-architect
avonni / skills

複数の成果物にまたがる Avonni ソリューションを設計・編成する。リクエストが複数の Avonni 成果物タイプ(Dynamic Component、Flow Screen Components、Experience site components)にまたがる場合、または単一の名前付き成果物ではなくビジネスユースケースを記述している場合(例:コンポーネントとそれが起動する flow)は必ずアクティブ化する。既知のタイプの単一の成果物には使用しない — そのスキルを直接使用すること。

開発54
A
avonni-dynamic-components
avonni-dynamic-components
avonni / skills

Avonni Dynamic Components を作成または更新する。ユーザーが動的コンポーネントの構築、生成、変更を求めたとき、または Dynamic Component JSON、クエリ、リソース、メタデータファイルを扱うときに使用する。リクエストが複数の Avonni 成果物タイプにまたがる場合や、エンドツーエンドのユースケース(コンポーネントとそれが起動するフロー、ポータルページなど)を記述している場合は使用しない — 代わりに avonni-architect skill を使用する。

開発54
B
brand-reader
brand-reader
kelpi-ai / meta-ads-skills

ウェブサイトを実用的なブランドキット(オファー、トーン、色、フォント、証拠)として読み取り、クリエイティブブリーフなしで広告を書いてデザインできるようにする。あらゆるキャンペーンの開始時、または広告がブランドから外れ続けるときに使用。

マーケティング・グロース54
C
canva-classroom-helper
canva-classroom-helper
canva-sdks / canva-skills

Canva で授業計画を授業用スライドデッキに変換します。授業計画から教室用スライドを作成する、授業計画をプレゼンテーションに変換する、授業用デッキを作る、アウトラインから学校用スライドを作成する、生徒向けの授業デッキを生成するよう求められた場合に使用します。入力には、メッセージに貼り付けた授業計画、Canva design ID、名前で指定された Canva ドキュメントまたはデザイン、Canva デザインリンク(例:https://www.canva.com/design/...)を使用できます。

ドキュメント54
C
card-news-generator
card-news-generator
bear2u / my-skills

背景画像を任意で追加し、600x600 の Instagram 風カードニュースシリーズを自動作成します。ユーザーがトピック、色、任意の画像を指定すると、Claude がコンテンツを生成し、適切にテキストを折り返した複数のカードを作成します

クリエイティブ・メディア54
C
competitive-visual-audit
competitive-visual-audit
mike-coulbourn / claude-vibes

競合ブランドを分析し、アイデンティティの意思決定の前に視覚的・ポジショニング上の空白を見つけるときに使用します。たとえば、競合の色、タイポグラフィ、ロゴ、イメージ、ボイスを監査したり、知覚マップを構築したりする場合です。キーワード — competitive audit、competitor analysis、visual landscape、differentiation、white space、perceptual mapping、zig when others zag。

デザイン・UI54
C
compose-kotlin-agent-skills
compose-kotlin-agent-skills
haidrrrry / compose-kotlin-agent-skills

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」について尋ねるときに使用。

開発54
C
concept-atlas-dense-explain
concept-atlas-dense-explain
wurenrumian / concept-atlas

トピックや既存のドキュメントを、インタラクティブな Concept Atlas 解説に変換します。AI で編集可能な MDX をスタンドアロン HTML にコンパイルし、概念ノード、関係グラフ、数式、チャート、図、引用、読解補助を含めます。技術解説、概念マップ、階層型ナレッジページ、詳細な解説、インタラクティブな学習ページに使用します。概念図/知識地図/階層型解説にも対応します

ドキュメント54
C
customer-journey
customer-journey
flitzrrr / frontend-design-skills

ペルソナ、タッチポイントのマッピング、フェーズモデル、オンボーディング、顧客維持、ユーザー中心の Web デザインのためのデータドリブンなジャーニー分析。

デザイン・UI54
D
daisy-ui
daisy-ui
dejanvasic85 / williamstownsc

事前にデザインされた UI コンポーネントのセットを提供する Tailwind CSS コンポーネントライブラリ。Williamstown SC ブランドに合致する、アクセシブルでテーマ化されたコンポーネントに使用。

デザイン・UI54
D
dark-tech
dark-tech
madebymustafa / design-taste

ジャンルパック:ダークで精密、開発者に近いミニマリズム——Linear/Vercel/Stripe-dark 系のスタイル。ほぼ黒のサーフェス、控えめなアクセントカラー、細い境界線、コンパクトな文字、アクセント部分のみに施す微かな発光、ダッシュボード向けの高密度なレイアウト。開発者ツール、インフラ製品、AI プラットフォーム、技術系のユーザー向けに使用します。design-taste core skill に重ねて使用します。

デザイン・UI54
D
dillion-portfolio
dillion-portfolio
rebyteai-template / rebyte-skills

Next.js 14 を使った、ブログ、職歴タイムライン、プロジェクト紹介を備えたミニマルな開発者ポートフォリオ。

デザイン・UI54
D
draw-io
draw-io
i9wa4 / dotfiles

draw.io 図の作成、編集、レビュー。.drawio XML の編集、PNG 変換、レイアウト調整、AWS アイコンの利用。

デザイン・UI54
E
experience-content-media-image-generate
experience-content-media-image-generate
forcedotcom / sf-skills

メディア管理 MCP サーバーを使用して、高精細なビジュアル素材、ロゴ、UI モックアップを生成します。画像の生成、ロゴの作成、ヒーローバナーの制作、UI アイコンのデザイン、ビジュアル素材の作成をユーザーが求めた場合に、このスキルを起動します。ファイル形式(PNG、JPEG、WEBP)、指定サイズ(例:1024x1024)、透過要件などの技術仕様に対応するよう設計されています。生成画像をアプリケーションコードやウェブページに組み込む場合に使用します。出力品質を一定に保ち、生成ツールが利用できない場合は標準化された SVG の代替を提供します

クリエイティブ・メディア54
F
figma-context-reader
figma-context-reader
sergekostenchuk / ui-ux-agent-skill-system

UI/UX の実装、監査、デザインシステムの作業のために Figma のデザインコンテキストを読み取り要約する。ユーザーが Figma URL、選択した Figma ノード、フレーム、コンポーネント、Dev Mode コンテキスト、variables、library、スクリーンショットを提供し、Figma ファイルを変更せずに階層、レイアウト、トークン、コンポーネント、アセット、バリアント、インタラクションの注記、実装上の制約に関する構造化された事実を求める場合にこのスキルを使用する。

デザイン・UI54
F
figma-design-to-code-bridge
figma-design-to-code-bridge
sergekostenchuk / ui-ux-agent-skill-system

Figma フレームとデザインコンテキストを、実装可能なフロントエンド計画、コンポーネントマッピング、コードの引き継ぎに変換する。ユーザーが Figma フレームから構築したい、Figma コンポーネントとコードコンポーネントを比較したい、Code Connect を使いたい、ピクセル単位のコピーを避けたい、variables をトークンにマッピングしたい、あるいは作業が webapp-ui-skill、marketing-site-skill、ローカルコード実装のどれに属するかを判断したい場合にこのスキルを使用する。

デザイン・UI54
F
fixing-accessibility
fixing-accessibility
marcioaltoe / skills

ARIA ラベル、キーボードナビゲーション、フォーカス管理、色のコントラスト、フォームエラーなど、HTML のアクセシビリティ上の問題を監査して修正します。インタラクティブなコントロール、フォーム、ダイアログの追加や、WCAG 準拠のレビューに使用します

デザイン・UI54
F
framer
framer
framer / dalton

Framer プロジェクトをプログラムで構築・編集する。CMS コレクションの管理、キャンバスの編集、コードコンポーネントの作成、スタイルの管理、画像のアップロード、公開などを行う。

デザイン・UI54
F
frontend-ui-integration
frontend-ui-integration
julianromli / ai-skills

Web アプリケーションでユーザー向けワークフローを実装または拡張し、既存のバックエンド API と統合する。その機能が主に既存 API に支えられた UI/UX の変更であり、Web フロントエンドのみに影響し、デザインシステム、ルーティング、テストの規約に従う必要がある場合に使用する。

開発54
G
generate-svg
generate-svg
b-open-io / gemskills

ユーザーが「generate SVG」「create SVG」「make a logo」「create vector graphics」「generate icon」「make vector illustration」「vectorize image」を求めたり、AI によるスケーラブルベクターグラフィックスの生成を必要としたりするときに、このスキルを使用する。

クリエイティブ・メディア54
G
gpt-slide-design
gpt-slide-design
humantonylee / future-slide

規律あるスライド生成のためのワークフロー。デザインを抽出し、デッキを計画し、一貫性を保ってレンダリングします。

ドキュメント54
G
graphic-ebook
graphic-ebook
varnan-tech / opendirectory

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" と言ったときにトリガーする。

マーケティング・グロース54
G
graphviz-diagrams
graphviz-diagrams
mindmorass / reflex

Graphviz DOT 言語を使って複雑なグラフ可視化を作成し、ソースコードと事前レンダリング済み画像の両方を提供する。

デザイン・UI54
H
HA Dashboard Design
HA Dashboard Design
tonylofgren / aurora-smart-home

完全な 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」という言葉を使わない場合でも。

デザイン・UI54
H
help-center-architecture
help-center-architecture
sylphxai / skills

ヘルプセンター、ドキュメント、サポートナレッジベース、FAQ、トラブルシューティング、返金/キャンセルガイド、オンボーディングドキュメント、開発者ドキュメント、ゲームサポート記事、セルフサービスサポートの設計を設計・監査する。サポート負荷の軽減、カスタマーサクセスの向上、サポートコンテンツの構造化、プロダクトフローに紐づくヘルプコンテンツの作成に使用する。

ドキュメント54
I
igniteui-angular-theming
igniteui-angular-theming
igniteui / igniteui-angular

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 を使用)。

デザイン・UI54
10,586 件中 8641–8700 件

MCP は初めてですか?

プロトコルの概要から最初のサーバーの導入まで、よくある疑問にまとめて答えます。

AI アプリケーションが外部のツールやデータソースに統一的な方法で接続するためのオープンなプロトコルです。クライアントはモデルとの対話を担い、MCP サーバーはツール・リソース・プロンプトテンプレートを提供します。標準メッセージでやり取りするため、1 つのサーバーを複数のクライアントで再利用できます。