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 UXVisual Brand Extractor Skill: Pull Colors and Fonts from a Sitegooseworks-ai/goose-skillsThe visual-brand-extractor skill has an AI coding agent read a client's website, identify its colors, fonts and layout style, and save a reusable slide preset and brand config.1.2KGitHub stars Skill · Web design and UXVisual Design Foundations Skill: Type, Color, Spacingwshobson/agentsThe visual-design-foundations skill gives an AI coding agent a modular type scale, an 8 point spacing grid, semantic colour tokens and icon guidance, with three reference files behind them.40.2KGitHub stars Skill · Web design and UXVisual Design Mastery Skill: Score and Judge Visual Qualityphazurlabs/sumiThe visual-design-mastery skill gives an AI coding agent 36+ designer pattern libraries, 70 canonical rules and a 10 dimension score for judging visual quality.55GitHub stars Skill · Web design and UXVisual Explainer Skill: Turn Diffs and Plans into HTML Pagesnicobailon/visual-explainerThe visual-explainer skill makes an AI coding agent write a self-contained HTML page, with diagrams, tables or slides, instead of dumping ASCII art and pipe tables in the terminal.10.3KGitHub stars Skill · Web design and UXVisual Testing Advanced Skill: Baseline Screenshots and Pixel Diffsproffesor-for-testing/agentic-qeThe visual-testing-advanced skill has an AI coding agent capture baseline screenshots, diff them against new runs, mask dynamic content and check responsive viewports before a UI change ships.499GitHub stars Skill · Design systems and tokensVois Tokens Skill: Design Rules for AI Coding Agentsommakes/SkillsThe vois-tokens skill gives an AI coding agent design system rules for spacing, typography, color tokens, animation and accessibility, built on shadcn/ui, Tailwind v4 or StyleX, and Motion.21GitHub stars Skill · Web design and UXWaza UI Skill: Distinctive Interfaces and Screenshot Polishtw93/WazaThe waza-ui skill is the ui habit from the Waza set. It makes an AI coding agent lock a design direction first, then build or fix interfaces against real screenshots.7.2KGitHub stars Skill · Web design and UXWCAG Accessibility Audit Skill for WCAG 2.1 and 2.2mastepanoski/claude-skillsThe wcag-accessibility-audit skill walks an AI agent through a WCAG 2.1 and 2.2 review of your site, organized by the four POUR principles and by A, AA and AAA levels.54GitHub stars Skill · Web design and UXWeb Accessibility Audit Skill: A Four Phase WCAG Checkwarpdotdev/oz-skillsThe web-accessibility-audit skill from the oz-skills repo guides an AI coding agent through a four phase WCAG 2.0, 2.1 and 2.2 audit and writes a prioritised report.825GitHub stars Skill · Web design and UXWeb Component Design Skill: React, Vue and Sveltewshobson/agentsThe web-component-design skill covers composition patterns, five styling approaches and component API rules for React, Vue and Svelte, with a class-variance-authority button as its quick start.40.2KGitHub stars Skill · Web design and UXWeb Design Engineer Skill: A Design Process for Agentsconardli/garden-skillsWeb Design Engineer makes an AI agent verify facts, declare a design system, show a v0 and stop at checkpoints before it builds a page, dashboard, deck or prototype.12.7KGitHub stars Skill · Web design and UXWeb Design Reviewer Skill: Find and Fix UI Bugs Visuallygithub/awesome-copilotThe web-design-reviewer skill has an AI coding agent open a running site, screenshot it at four widths, spot layout and accessibility issues, and fix them in source code.39.7KGitHub 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.