Skills
エージェント向けにパッケージ化された専門スキルと手順を 97,501 件掲載。コマンド 1 行でインストールできます。
デザイン・UI
PDF、構造化テキスト、Markdown、論文の要約、アウトライン、研究ノートから、学術プレゼンテーション風の HTML スライドデッキやブラウザレポートを生成します。科学論文の PDF を、図表、構造化された洞察、セクションページ、オフライン用デッキディレクトリ出力を備えたインタラクティブな HTML レポート、クリック可能なウェブプレゼンテーション、共有可能なブラウザデッキ、または PPT 風の HTML 出力に直接変換したい場合に使用します。Aut_Sci_Write スイートでは、HTML/ウェブ出力にはこの skill を、.pptx ファイルが明確に必要な場合は sci-ppt を選択します。
Web サイトをクローンする 2 つのモード。SNAPSHOT = ページの忠実で自己完結したオフラインコピー(HTML+CSS+JS+画像を 1 ファイルにまとめ、バイト単位で完全一致する SingleFile 形式)。RECONSTRUCT = AI でページをリバースエンジニアリングし、整理された編集可能な Next.js/Tailwind コードベースに変換(デザイントークン → コンポーネント仕様 → 並列ビルダー → ビジュアル差分 QA、ai-website-cloner-template の方式)。ユーザーが「このサイトをクローン」したい場合、ページのデザイン/UI とインタラクションをコピーしたい場合、レイアウトを再現したい場合、オフライン保存したい場合、または編集可能なコードとしてサイトを再構築したい場合に使用。今すぐ構築し後で適応:組み込みのスナップショット機能はすぐに利用可能。忠実なライブキャプチャと再構築パイプラインは、設定 1 つで切り替えるエンジンアダプター。
Designer Extensions(Webflow Designer 内の iframe)の構築、または Designer API Playground 用のコードスニペット生成を通じて、Webflow Designer API を扱います。要素の操作、スタイル、コンポーネント、ページ、変数、アセット、エラー処理、CLI の使用、UI デザインパターンを網羅します。Designer Extensions の作成、デバッグ、変更、またはユーザーが Playground アプリで Designer API コードを実行したい場合に使用します。
Figma MCP と Playwright を使用した、Next.js/React 向けの自律的なピクセルパーフェクト UI 実装ループ。Figma のデザインを本番環境向けコンポーネントに変換し、反復的なビジュアル検証を行います。Figma デザインの実装に関するあらゆる依頼で自動起動します。例:「この Figma を実装」「Figma からこのページ/コンポーネントを構築」「Figma のデザインから作成」「デザインを実装」「このブロックを構築」「デザインからコンポーネントを作成」。用途:(1)Figma からページ/コンポーネントを構築、(2)ピクセルパーフェクトな再現、(3)レスポンシブレイアウト、(4)デザイントークンの変換。
ユーザーが UI5 アプリケーションファイル(ビュー、フラグメント、コントローラー)のアクセシビリティ、a11y、ARIA、WCAG 準拠、ランドマーク、ラベル、見出しレベル、フォーカス処理、キーボード操作、キーボードショートカット、スクリーンリーダー対応、不可視メッセージ、読み上げ順序、またはタッチ領域/ターゲットサイズの監査、修正、確認、レビュー、改善を求めた場合に使用します。新しい UI5 ビュー、フラグメント、コントローラーを作成し、アクセシブルにしたい場合や、特定のコントロール(Dialog、Table、Panel など)がアクセシビリティ要件を満たすか尋ねられた場合にも使用します。キーワード:accessibility、a11y、ARIA、WCAG、screen reader、NVDA、JAWS、VoiceOver、landmark、landmarkInfo、accessibleRole、ariaLabelledBy、ariaDescribedBy、labelFor、tooltip、alt text、decorative、heading level、initialFocus、F6、fast nav、fastnavgroup、tabindex、CommandExecution、keyboard shortcut、InvisibleMessage、announce、reading order、reactiveAreaMode、target size。
vibe coding 由来の AI 生成らしい UI を、独自の個性を持つデザインインターフェースに仕上げます。まずプロダクト自体から方向性を見つけ、間隔、色、アイコン、コピー、書体、レイアウト、細部、ビジュアル、モーションの順に調整します。利用可能な場合は、画像ツールで実際のヒーロービジュアルも生成できます。AI 生成らしさをなくすための画面の仕上げ、整理、再デザインを求められたときや、紫のグラデーション、光彩、グラデーション文字、絵文字ラベル、「New ✨」バッジ、光沢のある塊、字間を広げた大文字ラベル、点滅要素、不均一な間隔など、ありがちな特徴が UI に見られるときに使います。React、Tailwind、HTML、CSS に対応し、ダッシュボード、アプリ、ランディングページに使えます。
モーションとインタラクションデザインの専門家です。意図のある動きを取り入れたインタラクティブコンポーネントの構築と、既存アニメーションの AI らしい定型表現の監査という 2 つのモードがあります。監査では、各指摘にループ再生の CSS デモを添えたブランド仕様の HTML レポートを生成します。Emil Kowalski(抑制)、Jakub Krehel(本番品質の仕上げ)、Jhey Tompkins(創造的な実験)の考え方に基づき、プロジェクトの文脈に応じて各視点の重みを調整します。React、Framer Motion、CSS、HTML で動作します。
ネイティブらしい macOS アプリの UI をデザイン、構築します。デスクトップアプリ、macOS アプリ、Mac スタイルのインターフェース、Apple スタイルの UI、システムユーティリティ、または Mac ネイティブのような外観や操作感が求められるものをユーザーが依頼した場合に使用します。「ネイティブな操作感」「デスクトップアプリのデザイン」「Apple のデザインパターン」「サイドバーのレイアウト」「信号機ボタン」などに言及した場合や、macOS に馴染むツール/ユーティリティを作りたい場合にも使用します。レイアウト、構成、インタラクションパターン、アニメーション、ライト/ダークモード、Apple が作ったように感じさせる細部を扱います。
react-bits(github.com/DavidHDev/react-bits)を統合、カスタマイズし、コントリビュートします。アニメーション付き React コンポーネントのライブラリとして最大規模かつ創造性に富み、Vite、Tailwind CSS v4、Three.js/Fiber、GSAP、Framer Motion の統合を扱います。react-bits、アニメーション付き React コンポーネント、jsrepo registry、または react-bits リポジトリへの新しいアニメーションコンポーネントのコントリビュートについてユーザーが尋ねたときに使用します。
AI アプリケーションが外部のツールやデータソースに統一的な方法で接続するためのオープンなプロトコルです。クライアントはモデルとの対話を担い、MCP サーバーはツール・リソース・プロンプトテンプレートを提供します。標準メッセージでやり取りするため、1 つのサーバーを複数のクライアントで再利用できます。
