Design skills

Design Skills

Agent skills for design and WordPress work, each linked to its original GitHub repository.

363 entries

SortMost installed A to Z

Skill · Web design and UXqiaomu-design Skill: Four Design Directions Before Codejoeseesun/qiaomu-designThe qiaomu-design skill makes an AI coding agent diagnose a UI first, show four real design directions on one preview page, then build the one you pick.577GitHub stars Skill · Design systems and tokensRampstack Design System Skill: Build or Audit Onerampstackco/claude-skillsThe rampstack design-system skill makes an AI coding agent build or audit a design system in five layers, from tokens up to governance, and write an audit report.935GitHub stars Skill · Web design and UXReact Native Design Skill for AI Coding Agentswshobson/agentsThe react-native-design skill guides an AI coding agent through React Native styling, navigation and Reanimated animation for cross-platform mobile screens.41.1KGitHub stars Skill · Web design and UXRedesign Screen Skill: Redesign From Real App Referencesmobbin/skillsThe redesign-screen skill has an AI coding agent redesign a screen, section or component from a screenshot, code or design file, backed by how real apps on Mobbin handle it.33GitHub stars Skill · Web design and UXRefero Design Skill: Research-First UI Designreferodesign/refero_skillThe refero-design skill forces an AI coding agent to research styles, screens and flows from real products before it designs, then lock a reference direction before any code is written.292GitHub stars Skill · Web design and UXResponsive Design Skill: Breakpoints and PatternsOwl-Listener/designer-skillsThe responsive-design skill from designer-skills gives an AI agent four breakpoint bands, four layout patterns and input rules, from 44px touch targets to focus order.2.8KGitHub stars Skill · Web design and UXResponsive Design Skill: Container Queries and Fluid Layoutswshobson/agentsThe responsive-design skill from wshobson/agents steers an AI coding agent toward mobile-first breakpoints, container queries, fluid type and CSS Grid, with a short list of common layout bugs.40.2KGitHub stars Skill · Figma and design to codesb-figma Skill: Figma Tokens and Components Into Storybookstrongeron/storybook-workbenchThe sb-figma skill lets an AI coding agent check Figma variables against code tokens, deliver approved Figma components into Storybook, and build Code Connect mappings.39GitHub stars Skill · Web design and UXshadcn-svelte Skill: Svelte UI Components Done by the Ruleshuntabyte/shadcn-svelteThe shadcn-svelte skill teaches an AI coding agent to add, update and compose shadcn-svelte components in a SvelteKit project, using flex gap, semantic colors and the right Svelte import style.9.2KGitHub stars Skill · Web design and UXshadcn-vue Skill: Add and Compose Vue UI Componentsunovue/shadcn-vueThe shadcn-vue skill injects live project context from the CLI, then guides an AI coding agent through finding, adding, reviewing and styling shadcn-vue components with strict rules for forms, icons...10.7KGitHub stars Skill · Web design and UXSleek Design Mobile Apps Skill: Setup and Workflowsleekdotdesign/agent-skillsThe sleek-design-mobile-apps skill teaches an AI agent to create Sleek projects, chat for mobile screens, capture screenshots and pull HTML through the Sleek REST API.584GitHub stars Skill · Web design and UXSoftware UI/UX Design Skill: Audit and Design with a Craft Barvasilyu1983/ai-agents-publicThe software-ui-ux-design skill has an AI coding agent audit or design interfaces across six modes, with state coverage, computed contrast and a ten-row Craft Bar before handoff.90GitHub stars

Turn what your agent designs into a real WordPress site

Use skills like this to get better HTML, CSS and JS from your agent, then publish the result as editable WordPress.

I have a Figma designTurn it into editable WordPress I built it with an AI toolLovable, v0, Bolt, Claude and more I have HTML, CSS and JSBring a build into WordPress I want to design in WordPressComposer, the AI visual editor

Browse the directory

Skills, MCP servers, comparisons, alternatives and guides for design to WordPress work.

Design Skills

Agent skills that sharpen design, layout and polish.

Explore NowDesign MCPs

MCP servers that connect your AI to design tools.

Explore NowCompare

AI and design tools side by side, with a verdict.

Explore NowAlternatives

Ranked alternatives to the tools you already know.

Explore NowSolutions

Step-by-step routes from a design or AI build to WordPress.