Setup & Installation
npx skills add https://github.com/WordPress/agent-skills --skill wpds
https://github.com/WordPress/agent-skills/tree/trunk/skills/wpds
View on GitHubWhat This Skill Does
Assists with building UI components and interfaces using the WordPress Design System (WPDS). Covers components, design tokens, spacing scales, typography, and color primitives across WordPress contexts like Gutenberg, WooCommerce, and WordPress.com.
Rather than guessing at WordPress design conventions or digging through scattered docs, it pulls authoritative WPDS component and token data directly from the MCP server, so the output matches what WordPress ships.
When to use it
- Building a custom Gutenberg block using WPDS components and tokens
- Checking which @wordpress/components package component fits a specific UI pattern
- Replacing hardcoded color values with WPDS color primitives in a WooCommerce plugin
- Applying the correct WPDS spacing scale to a WordPress.com admin interface
- Reviewing a React component for WPDS token compliance before a PR