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 UXBetter Interface Skill: One Review Across Six Domainsjakubkrehel/skillsThe better-interface skill runs one ranked review of a screen or flow across accessibility, layout, writing, typography, color and UI polish, using its sibling skills as the rules.7.5KGitHub stars Skill · Web design and UXBetter Layout Skill: Grouping, Alignment and RTL Checksjakubkrehel/skillsThe better-layout skill sets grouping, alignment, reading order and responsive structure, then stress tests the result by resizing, translating and mirroring it for right to left.7.5KGitHub stars Skill · Web design and UXBetter Typography Skill: Type Scale, Wrapping and Punctuationjakubkrehel/skillsThe better-typography skill checks how text renders, from type scale and line-height to font features, wrapping, truncation and punctuation, with exact values where they are measurable.7.5KGitHub stars Skill · Web design and UXBetter UI Skill: Exact Radius, Shadow and Motion Valuesjakubkrehel/skillsThe better-ui skill polishes surfaces, icons and motion with exact values for nested border radius, shadows, press scale, enter and exit timing and icon cross-fades.7.5KGitHub stars Skill · Design systems and tokensBrand Extract Skill: Build a Brand Kit From a Live Sitenexu-io/open-designThe brand-extract skill has an AI coding agent measure a live website's colors, fonts, logos and imagery, then write a Brand Kit that OpenDesign can register as a design system.99.8KGitHub stars Skill · Web design and UXBuild Design Skill: Turn Figma or Images Into Matching UIjakubkrehel/skillsThe build-design skill builds UI from a Figma file or a design image using your project's existing tokens and components, then compares the render against the design before finishing.7.5KGitHub stars Skill · Design systems and tokensBuilding Components Skill: Composable, Accessible UIvercel/components.buildThe building-components skill from the components.build spec points an AI coding agent to 15 reference files on composition, accessibility, tokens, state and distribution.798GitHub stars Skill · Design systems and tokensChakra UI Builder Skill: Chakra UI v3 Components and Themeschakra-ui/chakra-uiThe chakra-ui-builder skill makes an AI coding agent write Chakra UI v3 components with semantic tokens, Field.Root forms and mobile first breakpoints, and set up the provider first.40.7KGitHub stars Skill · Web design and UXCinematic Scrub Landing Skill: Mouse-Scrub Video Herohoodini/ai-agents-skillsA skill that turns a hero video and a brand into a landing page where moving the cursor scrubs the video, with opaque story sections below.281GitHub stars Skill · Web design and UXColor Contrast Skill for AI Coding Agentsmgifford/accessibility-skillsThe color-contrast skill checks text, icons and UI controls against WCAG 2.2 contrast thresholds across light, dark and forced-colors modes before shipping.56GitHub stars Skill · Design systems and tokensColor Mode and Theme Skill: Light, Dark or Bothdembrandt/dembrandt-skillsThe color-mode-and-theme skill helps an AI coding agent choose light, dark or combined mode from brand tone, decide when a theme selector is worth building, and set dark mode token...66GitHub stars Skill · Web design and UXColor System Skill: Tonal Scales and ContrastOwl-Listener/designer-skillsThe color-system skill has an AI agent build brand, neutral and semantic palettes with 50 to 950 tonal scales, plus contrast targets of 4.5 to 1 for text.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.