Design skills

Design Skills

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

76 entries

SortMost installed A to Z

63Skill · Web design and UXWeb Quality Audit Skill: Lighthouse-Style Audits for AI Agentsaddyosmani/web-quality-skillsThe web quality audit skill makes an AI coding agent run one evidence-led review across performance, accessibility, SEO, best practices and agentic browsing, with severity levels and a re-check step.29Kinstalls2.9K stars 64Skill · Web design and UXCore Web Vitals Skill: Fix LCP, INP and CLS With AI Agentsaddyosmani/web-quality-skillsThe Core Web Vitals skill makes an AI coding agent diagnose LCP, INP and CLS from CrUX and trace evidence before editing, then verify with an equivalent lab run.28.4Kinstalls2.9K stars 65Skill · Web design and UXBaseline UI Skill for Cleaner AI-Built Interfacesibelick/ui-skillsThe baseline-ui skill from ibelick/ui-skills gives an AI coding agent a list of MUST, SHOULD and NEVER rules for Tailwind interfaces, animation, accessibility and layout.21.4Kinstalls9.4K stars 66Skill · 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.3.3Kinstalls9.4K stars 67Skill · Web design and UXBrandkit Skill: Brand Design Tokens for AI Agentsplugin87/ux-ui-agent-skillsThe brandkit skill turns a brief into a verified brand foundation: OKLCH color ramps, light and dark themes, type and spacing scales, DTCG tokens and one theme.css that every screen...356installs1.5K stars 68Skill · Web design and UXApple Design Skill: Fluid Interface Rules for the Webboraoztunc/skillsThe apple-design skill teaches an AI coding agent Apple's fluid interface principles for the web: springs, velocity handoff, momentum projection, translucent materials and reduced motion.117installs388 stars 69Skill · Web design and UXAnimation Vocabulary Skill: Name Any Motion Effectbabznxbz/website-skillThe animation-vocabulary skill turns a vague description of a web animation into its exact name, so you can ask an AI coding agent for the effect you actually want.2installs 70Skill · Web design and UXImagegen Frontend Web Skill: Website Design Referencesmakies06/imagegen-frontend-webThe imagegen-frontend-web skill makes an AI agent with image generation produce premium website design references through a six-block prompt template, a variation engine and a self-critique gate.1installs1 stars Skill · Web design and UXCritique Skillpbakaus/impeccableImpeccable critique is the command that reviews a UI like a design director would, with scored heuristics and ranked issues, then hands you the fixes to run next.76.8KGitHub stars Skill · Web design and UXFixing Accessibility Skillibelick/ui-skillsA skill that makes your coding agent audit HTML for missing names, broken keyboard access, bad focus handling and unlinked form errors, then fix them with small edits.9.4KGitHub stars Skill · Web design and UXFixing Metadata Skillibelick/ui-skillsA skill that has your coding agent audit page titles, descriptions, canonical URLs, Open Graph tags, icons and JSON-LD, then fix the wrong ones with small, scoped diffs.9.4KGitHub stars Skill · Web design and UXFixing Motion Performance Skillibelick/ui-skillsA skill that stops your coding agent from writing janky animation, with rules for compositor properties, layout thrashing, scroll-linked motion, blur and will-change.9.4KGitHub 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.