·design-analyzer
*

design-analyzer

kanopi/cms-cultivator

Automatically extract technical requirements from design references when user mentions Figma, uploads images, or says "implement this design". Analyzes colors, typography, spacing, layout, and maps to WordPress blocks or Drupal paragraph fields. Provides detailed specifications for developers including exact values, responsive behavior, and accessibility requirements.

5Installs·0Trend·@kanopi

Installation

$npx skills add https://github.com/kanopi/cms-cultivator --skill design-analyzer

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"

Automatically extract technical requirements from design references when user mentions Figma, uploads images, or says "implement this design". Analyzes colors, typography, spacing, layout, and maps to WordPress blocks or Drupal paragraph fields. Provides detailed specifications for developers including exact values, responsive behavior, and accessibility requirements. Source: kanopi/cms-cultivator.

View raw

Facts (cite-ready)

Stable fields and commands for AI/search citations.

Install command
npx skills add https://github.com/kanopi/cms-cultivator --skill design-analyzer
Category
*Creative Media
Verified
First Seen
2026-02-01
Updated
2026-02-18

Quick answers

What is design-analyzer?

Automatically extract technical requirements from design references when user mentions Figma, uploads images, or says "implement this design". Analyzes colors, typography, spacing, layout, and maps to WordPress blocks or Drupal paragraph fields. Provides detailed specifications for developers including exact values, responsive behavior, and accessibility requirements. Source: kanopi/cms-cultivator.

How do I install design-analyzer?

Open your terminal or command line tool (Terminal, iTerm, Windows Terminal, etc.) Copy and run this command: npx skills add https://github.com/kanopi/cms-cultivator --skill design-analyzer Once installed, the skill will be automatically configured in your AI coding environment and ready to use in Claude Code or Cursor

Where is the source repository?

https://github.com/kanopi/cms-cultivator