Skip to content

/design-screenshot-spec

Turn user-supplied screenshots, copied inspect values, exports, assets, or design notes into a strict frontend Design Implementation Spec. Live design links alone are insufficient.

shell
$ npx -y skills add ytvee-dev/webdev-agent-kit --skill design-screenshot-spec --agent claude-code

How 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/design-screenshot-spec
How auto-invocation works

Context preview

The summary Claude sees to decide when to auto-load this skill.

Turn user-supplied screenshots, copied inspect values, exports, assets, or design notes into a strict frontend Design Implementation Spec. Live design links alone are insufficient.
Ships withwebdev-agent-kit

A cross-platform frontend kit for Codex, Claude Code, Cursor, OpenCode, etc. It helps AI coding agents work predictably and safely with existing frontend projects.

Get the whole plugin, auto-invoked