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 UXMCP Builder Skill: Build an MCP Serveranthropics/skillsThe mcp-builder skill in Anthropic's anthropics/skills repo walks an AI coding agent through planning, building and testing a Model Context Protocol server in Python or TypeScript.182.0KGitHub stars Skill · Figma and design to codeMigrate Elementor to Bricks Skill: Draft Duplicatesrespira-press/agent-skills-wordpressThe migrate-elementor-to-bricks skill has your AI coding agent map Elementor widgets to Bricks elements and write the result to draft duplicates, leaving the original pages untouched.45GitHub stars Skill · Convert to WordPressMigrate Elementor to Gutenberg Skill: Pages to Native Blocksrespira-press/agent-skills-wordpressThe migrate-elementor-to-gutenberg skill has an AI coding agent map Elementor widgets to core Gutenberg blocks, present a migration plan for approval and write draft duplicates for review.45GitHub stars Skill · Web design and UXMobile Experience Report Skill for WordPress Sitesrespira-press/agent-skills-wordpressThe mobile experience report skill has your AI coding agent audit a WordPress site's phone layout, pull mobile Core Web Vitals, and score the result from 0 to 100.45GitHub stars Skill · Web design and UXMobile Native Skill for AI Coding Agentsemilkowalski/skillsThe mobile-native skill fixes the CSS and meta tags that make a web app feel like a website in a browser instead of an installed native app.47.5KGitHub stars Skill · Web design and UXMockup Device 3D Skill: iPhone and MacBook Showcase Scenesnexu-io/open-designThe mockup-device-3d skill makes a 1920 by 1080 showcase with an iPhone and a MacBook drawn in CSS, real HTML on the screens, glass highlights and a turntable.100.7KGitHub stars Skill · Web design and UXModern CSS Skill: A Snippet Reference for Current Stylesheetspaulirish/dotfilesThe modern-css skill hands an AI coding agent a CSS reference: container queries, OKLCH color, scroll-driven animation, anchor positioning, cascade layers and a Baseline habit for checking browser support.4.4KGitHub stars Skill · Web design and UXModern Web Design Skill: Principles and Page Patternsfreshtechbro/claudedesignskillsThe modern-web-design skill packs seven design principles and seven page patterns, with Core Web Vitals targets, fluid type, accessible color and ready code for an AI coding agent.994GitHub stars Skill · Web design and UXMotion Design Patterns Skill for React Animationdylanfeltus/skillsThe motion-design-patterns skill gives an AI coding agent four named spring presets and eight Motion for React patterns for entrances, lists, layout changes, scroll effects and page transitions.179GitHub stars Skill · Web design and UXMotion Framer Skill: Animate React Interfacesfreshtechbro/claudedesignskillsThe motion-framer skill teaches an AI coding agent the Motion library, formerly Framer Motion, covering variants, gestures, exit animations, layout animations, springs and scroll effects for React.994GitHub stars Skill · Web design and UXMotion Graphics Skill: Short Design-Led Video Workflowheygen-com/hyperframesThe motion-graphics skill plans, builds and renders a short design-led motion graphic from kinetic type, stat counters, charts, logo stings or lower-thirds to MP4.67.2KGitHub stars Skill · Web design and UXMotion Lexicon Skill: Motion Design for AI Coding AgentsRyan-yang125/motion-lexiconThe motion-lexicon skill gives an AI coding agent six working modes, from recommending an animation to building a full page, with reduced motion and 44 px targets checked.47GitHub 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.