design-analyzer
✓ユーザーが Figma について言及したり、画像をアップロードしたり、「この設計を実装する」と発言したりすると、設計リファレンスから技術要件を自動的に抽出します。色、タイポグラフィ、間隔、レイアウトを分析し、WordPress ブロックまたは Drupal 段落フィールドにマップします。正確な値、応答動作、アクセシビリティ要件などの詳細な仕様を開発者に提供します。
SKILL.md
Purpose Extract technical requirements from design references (Figma URLs, screenshots, mockups) for CMS component implementation.
Accurate design-to-code translation requires systematic extraction of technical specifications.
User uploads image and says: "Create a WordPress block pattern from this hero design"
ユーザーが Figma について言及したり、画像をアップロードしたり、「この設計を実装する」と発言したりすると、設計リファレンスから技術要件を自動的に抽出します。色、タイポグラフィ、間隔、レイアウトを分析し、WordPress ブロックまたは Drupal 段落フィールドにマップします。正確な値、応答動作、アクセシビリティ要件などの詳細な仕様を開発者に提供します。 ソース: kanopi/cms-cultivator。
引用可能な情報
AI/検索での引用用の安定したフィールドとコマンド。
- インストールコマンド
npx skills add https://github.com/kanopi/cms-cultivator --skill design-analyzer- カテゴリ
- *クリエイティブ
- 認証済み
- ✓
- 初回登録
- 2026-02-01
- 更新日
- 2026-02-18
クイックアンサー
design-analyzer とは？
ユーザーが Figma について言及したり、画像をアップロードしたり、「この設計を実装する」と発言したりすると、設計リファレンスから技術要件を自動的に抽出します。色、タイポグラフィ、間隔、レイアウトを分析し、WordPress ブロックまたは Drupal 段落フィールドにマップします。正確な値、応答動作、アクセシビリティ要件などの詳細な仕様を開発者に提供します。 ソース: kanopi/cms-cultivator。
design-analyzer のインストール方法は？
ターミナルまたはコマンドラインツール（Terminal、iTerm、Windows Terminal など）を開きます このコマンドをコピーして実行します: npx skills add https://github.com/kanopi/cms-cultivator --skill design-analyzer インストール後、スキルは自動的に AI コーディング環境に設定され、Claude Code や Cursor で使用できるようになります
ソースリポジトリはどこですか？
https://github.com/kanopi/cms-cultivator
詳細
- カテゴリ
- *クリエイティブ
- ソース
- skills.sh
- 初回登録
- 2026-02-01