/wpds
Use when building UIs leveraging the WordPress Design System (WPDS) and its components, tokens, patterns, etc.
One skill from wordpress-agent-skills.
shell
$ npx -y skills add WordPress/agent-skills --skill wpds --agent claude-codeInstalls just this skill. Get the whole plugin for auto-invocation.
How it fires
How this skill gets triggered: by you, by Claude, or both.
- Fires itselfClaude auto-loads it when your prompt matches the work.
- You can call itInvoke it directly when you want it.
- Slash command
/wpds
Context preview
The summary Claude sees to decide when to auto-load this skill.
Use when building UIs leveraging the WordPress Design System (WPDS) and its components, tokens, patterns, etc.
Stats
Stars1,912
Forks286
LanguageJavaScript
SKILL.md
wpds.SKILL.md
--- name: wpds description: "Use when building UIs leveraging the WordPress Design System (WPDS) and its components, tokens, patterns, etc." compatibility: "Requires WPDS MCP server configured and running. Targets WordPress 7.0+ (PHP 7.4.0+)." --- # WordPress Design System (WPDS) ## Prerequisites This skill works best with the **WPDS MCP server** installed. The MCP provides access to WordPress Design System documentation and resources, such as components and DS token lists. The following terms should be treated as synonyms: - "WordPress" and "WP"; - "Design System" and "DS"; - "WordPress Design System" and "WPDS". ## When to use Use this skill when the user mentions: - building and/or reviewing any UI in a WordPress-related context (for example, Gutenberg, WooCommerce, WordPress.com, Jetpack, etc etc); - WordPress Design System, WPDS, Design System; - UI components, Design tokens, color primitives, spacing scales, typography variables and presets; - Specific component packages such as @wordpress/components or @wordpress/ui; ## Rules ### Use the WPDS MCP server to access WPDS-related documentation - Use the WPDS MCP server to retrieve the canonical, authoritative documentation: