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 UXDark Mode Design Expert Skill: Tokens, Elevation, Contrastcuriositech/some_claude_skillsThe dark-mode-design-expert skill teaches an AI agent three-tier color tokens, tonal elevation instead of shadows, moderate contrast targets and flash-free theme switching, with a weather and ocean worked example.243GitHub stars Skill · Web design and UXDark Mode Design Skill: Surfaces and ContrastOwl-Listener/designer-skillsThe dark-mode-design skill adapts an existing palette to dark surfaces, using lighter shades for elevation, off-white text and a 10 to 20 percent saturation cut.2.8KGitHub stars Skill · Web design and UXDashmotion Skill: Animated Flow and Architecture Diagramscsthink/dashmotionDashmotion turns plain English or Mermaid into one self contained HTML and SVG file where dashed connectors flow and light dots travel through the system like requests.174GitHub stars Skill · Web design and UXData Visualization Mastery Skill: Charts and Dashboardsphazurlabs/sumiThe data-visualization-mastery skill gives an AI coding agent 50+ chart types with selection criteria, dashboard composition, KPI cards, data tables, accessible presentation and React code with Recharts, D3 and Nivo.55GitHub stars Skill · Web design and UXDecision-First Dashboard Skill: Fewer KPIs, Clearer Decisionsfourleaf13-hue/decision-first-dashboardThe decision-first-dashboard skill makes an AI coding agent ask whether a dashboard is warranted, confirm the decision and action, then route metrics by role into the first view.52GitHub stars Skill · Web design and UXDesign Accessibility Auditor Skill: WCAG 2.1 Contrast Checkscuriositech/some_claude_skillsThe design-accessibility-auditor skill has an AI coding agent calculate WCAG 2.1 contrast, check touch targets and focus indicators, and write an audit report with specific fixes.244GitHub stars Skill · Web design and UXDesign Auditor Skill: UI Audits with Three Gradesborghei/Claude-SkillsThe design-auditor skill runs a 12 category UI and UX audit on static HTML and CSS, then gives three separate grades for design, AI slop and accessibility.875GitHub stars Skill · Web design and UXDesign Better Skill: UX Heuristics for UI Codebuildgreatproducts/builder-osThe design-better skill gives an AI coding agent 50 numbered UX and UI heuristics plus a pre-flight checklist, so generated interfaces are designed and not only functional.227GitHub stars Skill · Web design and UXDesign Brief Skill: Interview Before You Buildjulianoczkowski/designer-skillsThe design-brief skill interviews you, scans your codebase and saves a structured DESIGN_BRIEF.md under .design, so an AI coding agent builds from decisions and not guesses.576GitHub stars Skill · Figma and design to codeDesign Code Skill: Token Driven Componentsplugin87/ux-ui-agent-skillsPlugin87's design-code skill has an AI agent write accessible, token driven component code for React, Vue, SwiftUI and ten other stacks, then verify it against thirteen checks.1.5KGitHub stars Skill · Web design and UXDesign Component Skill: Component Specs with Eight Statesplugin87/ux-ui-agent-skillsThe design-component skill makes an AI coding agent write a component spec with anatomy, variants, sizes, eight states, token mapping and accessibility, then prove each state with scripted gates.1.5KGitHub stars Skill · Web design and UXDesign Critique Skill: Run Structured Team CritsOwl-Listener/designer-skillsThe design-critique skill from Owl-Listener's designer-skills gives an AI coding agent a framework to facilitate team critiques, with timed phases, feedback phrasing and action items.2.8KGitHub 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.