Design skills

Design Skills

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

369 entries

SortMost installed A to Z

Skill · Web design and UXCreate DESIGN.md Skill for AI Coding Agentsibelick/ui-skillsThe create-design-md skill from ibelick/ui-skills builds a DESIGN.md design-system file from your repository or a live URL, using evidence rules and the DESIGN.md lint and export tools.10.4KGitHub stars Skill · Web design and UXCritique Affordance Skill: Review What Looks ClickableOwl-Listener/designer-skillsThe critique-affordance skill has an AI coding agent review a screen for clickability signals, state visibility, CTA clarity and action discoverability, with a fix for each problem.2.9KGitHub stars Skill · Web design and UXCritique Color Skill: Contrast and Palette ReviewOwl-Listener/designer-skillsThe critique-color skill has an AI coding agent audit a screen's contrast ratios, palette coherence, semantic color use and color accessibility, then recommend specific corrections.2.9KGitHub stars Skill · Web design and UXCritique Composition Skill: Balance, Whitespace and RhythmOwl-Listener/designer-skillsThe critique-composition skill has an AI coding agent critique a screen's balance, whitespace, rhythm and gestalt grouping, then propose a specific fix for each weakness it finds.2.9KGitHub stars Skill · Web design and UXCritique Information Density Skill: Fix Overloaded ScreensOwl-Listener/designer-skillsThe critique-information-density skill has an AI coding agent review a screen's cognitive load, content priority, scanning pattern and progressive disclosure, then propose a specific fix for each.2.9KGitHub stars Skill · Web design and UXCritique Theater Skill: Five Dimension Design Self Checknexu-io/open-designThe critique-theater skill makes an AI coding agent review its own artifact on craft, critique, brand, accessibility and copy, then fix the defects before handing it over.100.7KGitHub stars Skill · Web design and UXCritique Visual Hierarchy Skill: Entry Point and Eye FlowOwl-Listener/designer-skillsThe critique-visual-hierarchy skill has an AI coding agent review a screen's entry point, eye flow, weight and emphasis, then propose targeted fixes when attention lands in the wrong place.2.9KGitHub stars Skill · Web design and UXCSS Animation Creator Skill for Motion That Stays FastOneWave-AI/claude-skillsA seven step motion workflow for AI coding agents, backed by ten reference files on transitions, keyframes, loaders, scroll effects, reduced motion and performance.323GitHub stars Skill · Web design and UXCSS Architecture Skill: BEM, SMACSS and CSS-in-JSaj-geddes/useful-ai-promptsThe css-architecture skill gives an AI coding agent BEM naming, SMACSS, styled components, CSS variables and a utility-first pattern for organizing large stylesheets.354GitHub stars Skill · Web design and UXCSS Border Gradient Skill for AI Coding Agentsboraoztunc/skillsThe css-border-gradient skill teaches an AI coding agent to add subtle gradient-border edges to cards, modals and buttons without a loud glow or rainbow effect.414GitHub stars Skill · Web design and UXCSS Expert Skill: Modern Flexbox, Grid and Container Queriesrightnow-ai/openfangThe css-expert skill from OpenFang gives an AI coding agent a compact CSS rulebook covering flexbox versus grid, custom property tokens, container queries, cascade layers, fluid type and common layout...18.2KGitHub stars Skill · Web design and UXCSS Native Skill: 12 Animation Principles in Pure CSSdylantarre/animation-principlesThe css-native skill gives an AI coding agent a CSS snippet for each of Disney's 12 animation principles, plus a timing reference table and the key CSS properties.102GitHub 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.