/responsive-styling
Automatically generate mobile-first responsive CSS/SCSS when creating component styles or mentioning responsive design. Implements standard breakpoints (768px, 1024px), ensures WCAG AA color contrast, creates touch-friendly interfaces (44px minimum targets), adds proper focus
$ npx -y skills add kanopi/cms-cultivator --skill responsive-styling --agent claude-codeHow it fires
How this skill gets triggered: by you, by Claude, or both.
- Fires itselfAuto-invocation. Claude auto-loads it when your prompt matches the work.
- You can call itInvoke it directly when you want it.
- Slash command
/responsive-styling
Context preview
The summary Claude sees to decide when to auto-load this skill.
Automatically generate mobile-first responsive CSS/SCSS when creating component styles or mentioning responsive design. Implements standard breakpoints (768px, 1024px), ensures WCAG AA color contrast, creates touch-friendly interfaces (44px minimum targets), adds proper focus
Specialist agents and auto-invoked skills for Drupal/WordPress development. Works in Claude Code, Claude Desktop, and OpenAI Codex. Full documentation: What changed in 2.0? CMS Cultivator now focuses on CMS development workflows.
Repo: kanopi/cms-cultivator
Other skills on cms-cultivator.
- /browser-validator
Automatically validate implementations in real browsers after code is written or when user says "test this", "test what you built in the browser", "check it in a real browser", or "validate at the breakpoints". Uses Chrome DevTools MCP to test responsive breakpoints (320px,
Open skill - /code-standards-checker
Automatically check code against PHPCS, ESLint, WordPress Coding Standards, or Drupal Coding Standards when user asks about code style, standards compliance, or best practices. Invoke when user mentions "coding standards", "code style", "linting", "PHPCS", "ESLint", or asks if
Open skill - /commit-message-generator
Automatically generate conventional commit messages when user has staged changes and mentions committing. Analyzes git diff and status to create properly formatted commit messages following conventional commits specification, and appends the Assisted-by git trailer recording
Open skill - /composer-patch-generator
Generate and maintain patches for Composer-installed packages (Drupal contrib modules, WordPress packages, PHP libraries) using cweagans/composer-patches. Invoke when the user needs to modify a contrib or vendor package, mentions "composer patch", "patch a module", "patch a
Open skill - /coverage-analyzer
Automatically analyze test coverage when user asks which code is tested, mentions coverage gaps, or shows code asking about testing. Identifies untested code paths and suggests test additions. Invoke when user asks "what's not tested?", "coverage", "untested code", or "which
Open skill - /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
Open skill