Agent skills for Windsurf (legacy)

Reproduce a design (HTML page, Claude Design .dc.html canvas, or design folder) as editable Divi 5 custom modules in one WordPress plugin…

Produce a design, planning, analysis, or architecture-decision document through a structured interview.

Creates a DESIGN_DOC.md for a feature, system, or change using a structured template.

Persist design documents with branch tracking, revision chains, and cross-session discovery

Transform approved requirements into comprehensive technical designs.

Extract design tokens (color / typography / spacing) from imported source code, screenshots, or Figma exports into the canonical token bag…

Generate developer handoff specs from a design.

Transform feature briefs into structured design briefs that give designers the context they need before opening Figma.

Communicate design's contribution to business and user outcomes in stakeholder language.

Interactive design session. Agent team debates architecture, captures decisions, logs ideas.

Autonomous multi-page site builder using a baton-passing loop.

Design a Zoom MCP workflow for Claude. Use when deciding whether Zoom MCP fits a task, when planning tool-based AI workflows, or when…

Create and manage DESIGN.md files. Useful for capturing design direction, tokens, and visual rules in a single source of truth.

Replicate the visual style of any website and apply it to your existing codebase.

Advocate for design quality, scope, and timeline with partners and leadership using evidence and shared goals.

Apply foundational design principles: affordances, signifiers, constraints, feedback, and conceptual models.

Classic and modern software design patterns

Define actionable principles that resolve trade-offs when the team disagrees.

Bitwarden design team's Code of Conduct combined with the 30/60/90 critique framework — stage-appropriate critique, product-not-designer…

Designs editable visuals for repository-owned product and developer documentation in a local pen.dev `.pen` file through Pencil MCP tools…

Designer Who Codes: visual audit then fixes with atomic commits and before/after screenshots.