# Skills for Design Skills for Design: what each one does, an install command and example prompts. 2133 cards · page 20 of 54 - HTML: https://affpapa.org/en/nevibecode/skills/topic/design?page=20 - Instructions for agents: https://affpapa.org/en/nevibecode/agents.md - [interview-script](https://affpapa.org/en/nevibecode/skills/owl-listener-interview-script.md) — skill · Owl-Listener · Claude Code, Codex, Cursor +3 · 2100 installs — Creates a structured user interview guide with open questions and facilitator notes. - [design-rationale](https://affpapa.org/en/nevibecode/skills/design-rationale.md) — skill · Owl-Listener · Claude Code, Codex, Cursor +3 · 2100 installs — Writes a design rationale that ties a decision to user needs, business goals and principles. - [card-sort-analysis](https://affpapa.org/en/nevibecode/skills/card-sort-analysis.md) — skill · Owl-Listener · Claude Code, Codex, Cursor +3 · 2100 installs — Processes open and closed card sorting data to generate similarity matrices and propose user-centered navigation categories. - [pattern-library](https://affpapa.org/en/nevibecode/skills/pattern-library.md) — skill · Owl-Listener · Claude Code, Codex, Cursor +3 · 2100 installs — This skill turns recurring UX solutions into pattern entries with problem context, behavior, examples, accessibility notes, and related patterns. - [affinity-diagram](https://affpapa.org/en/nevibecode/skills/affinity-diagram.md) — skill · Owl-Listener · Claude Code, Codex, Cursor +3 · 2100 installs — This skill groups observations and quotes from interviews into themed clusters and writes insight statements. - [documentation-template](https://affpapa.org/en/nevibecode/skills/documentation-template.md) — skill · Owl-Listener · Claude Code, Codex, Cursor +3 · 2100 installs — Generates reusable documentation scaffolds for design system components, patterns, and foundations. - [naming-convention](https://affpapa.org/en/nevibecode/skills/naming-convention.md) — skill · Owl-Listener · Claude Code, Codex, Cursor +3 · 2100 installs — Sets one naming scheme for components, tokens and layers so names stop drifting between files. - [empathy-map](https://affpapa.org/en/nevibecode/skills/empathy-map.md) — skill · Owl-Listener · Claude Code, Codex, Cursor +3 · 2100 installs — Builds an empathy map for one user or segment across four quadrants, so the team shares the same picture of the user. - [handoff-spec](https://affpapa.org/en/nevibecode/skills/handoff-spec.md) — skill · Owl-Listener · Claude Code, Codex, Cursor +3 · 2100 installs — Generates developer handoff specifications covering measurements, interaction states, responsive breakpoints, and edge cases before engineering starts. - [experience-map](https://affpapa.org/en/nevibecode/skills/experience-map.md) — skill · Owl-Listener · Claude Code, Codex, Cursor +3 · 2100 installs — The skill maps every touchpoint, channel and relationship across a service. - [jobs-to-be-done](https://affpapa.org/en/nevibecode/skills/owl-listener-jobs-to-be-done.md) — skill · Owl-Listener · Claude Code, Codex, Cursor +3 · 2100 installs — A Claude Code skill that runs a Jobs-to-Be-Done pass: splits a task into functional, emotional and social parts, then returns a map with design implications. - [user-persona](https://affpapa.org/en/nevibecode/skills/user-persona.md) — skill · Owl-Listener · Claude Code, Codex, Cursor +3 · 2100 installs — This skill builds 2-4 research-grounded personas from interview transcripts, surveys, or analytics. - [gesture-patterns](https://affpapa.org/en/nevibecode/skills/gesture-patterns.md) — skill · Owl-Listener · Claude Code, Codex, Cursor +3 · 2100 installs — Designs touch and pointer gestures such as swipes, dragging and long presses. - [feedback-patterns](https://affpapa.org/en/nevibecode/skills/feedback-patterns.md) — skill · Owl-Listener · Claude Code, Codex, Cursor +3 · 2100 installs — Gives the agent a method for designing how a system answers a user action: toasts, progress, badges, notifications. - [design-brief](https://affpapa.org/en/nevibecode/skills/owl-listener-design-brief.md) — skill · Owl-Listener · Claude Code, Codex, Cursor +3 · 2100 installs — Drafts a project brief covering problem space, audience, constraints, and success criteria. - [competitive-analysis](https://affpapa.org/en/nevibecode/skills/owl-listener-competitive-analysis.md) — skill · Owl-Listener · Claude Code, Codex, Cursor +3 · 2100 installs — A skill that compares rival products on UX: patterns, features, gaps and opportunities. - [prototype-strategy](https://affpapa.org/en/nevibecode/skills/prototype-strategy.md) — skill · Owl-Listener · Claude Code, Codex, Cursor +3 · 2100 installs — Decide what kind of prototype to build and how detailed it should be, before you start building it. - [theming-system](https://affpapa.org/en/nevibecode/skills/theming-system.md) — skill · Owl-Listener · Claude Code, Codex, Cursor +3 · 2100 installs — Designs a three-layer token architecture to support brand variants, color modes, and interface density in a single component library. - [journey-map](https://affpapa.org/en/nevibecode/skills/journey-map.md) — skill · Owl-Listener · Claude Code, Codex, Cursor +3 · 2100 installs — This skill maps one persona's end-to-end experience: stages, touchpoints, emotions and pain points. - [component-spec](https://affpapa.org/en/nevibecode/skills/component-spec.md) — skill · Owl-Listener · Claude Code, Codex, Cursor +3 · 2100 installs — This skill writes a full spec for one design-system component: anatomy, variants, states, accessibility and usage rules. - [design-principles](https://affpapa.org/en/nevibecode/skills/design-principles.md) — skill · Owl-Listener · Claude Code, Codex, Cursor +3 · 2100 installs — Helps teams define actionable design principles to resolve recurring product debates. - [accessibility-audit](https://affpapa.org/en/nevibecode/skills/accessibility-audit.md) — skill · Owl-Listener · Claude Code, Codex, Cursor +3 · 2100 installs — Audits an existing interface against WCAG and reports issues with severity, impact, and remediation steps. - [ux-writing](https://affpapa.org/en/nevibecode/skills/owl-listener-ux-writing.md) — skill · Owl-Listener · Claude Code, Codex, Cursor +3 · 2200 installs — Writes microcopy, error messages, empty states and CTAs. - [threejs-towers](https://affpapa.org/en/nevibecode/skills/threejs-towers.md) — skill · MengTo · Claude Code, Codex, Cursor +3 · 1200 installs — Builds pagodas, castles and domes from parameters instead of mesh files, then films the structure assembling from the ground up. - [audit-ai-design-slop](https://affpapa.org/en/nevibecode/skills/audit-ai-design-slop.md) — skill · MengTo · Claude Code, Codex, Cursor +3 · 1200 installs — Audits interfaces, mockups, and UI code for decorative clutter, generic AI clichés, and usability defects. - [threejs-landscape](https://affpapa.org/en/nevibecode/skills/threejs-landscape.md) — skill · MengTo · Claude Code, Codex, Cursor +3 · 1200 installs — This skill builds a live Three.js landscape: terrain, grass, stones, sky and a time-of-day cycle. - [falling-leaves](https://affpapa.org/en/nevibecode/skills/falling-leaves.md) — skill · MengTo · Claude Code, Codex, Cursor +3 · 1200 installs — Builds realistic falling foliage and petal animations for 2-D canvas and 3-D scenes where standard particle sprites look like flat confetti. - [pointer-trail-emitter](https://affpapa.org/en/nevibecode/skills/pointer-trail-emitter.md) — skill · MengTo · Claude Code, Codex, Cursor +3 · 1200 installs — A skill that teaches the agent to build a cursor trail whose mote spacing holds steady no matter how fast the hand moves. - [build-daily-inspiration-sites](https://affpapa.org/en/nevibecode/skills/build-daily-inspiration-sites.md) — skill · MengTo · Claude Code, Codex, Cursor +3 · 1200 installs — Creates separate Codex tasks for original landing pages from a completed UI inspiration pack. - [design-systems-slds-apply](https://affpapa.org/en/nevibecode/skills/design-systems-slds-apply.md) — skill · forcedotcom · Claude Code, Codex, Cursor +3 · 6000 installs — A skill that teaches the agent to build Salesforce Lightning Design System interfaces: blueprints, styling hooks, utility classes and icons. - [remotion-motion-graphics](https://affpapa.org/en/nevibecode/skills/remotion-motion-graphics.md) — skill · haidrrrry · Claude Code, Codex, Cursor +3 · 1100 installs — A coding-agent skill that makes Remotion code follow motion design rules instead of shipping linear fades and flat backgrounds. - [substance-3d-texturing](https://affpapa.org/en/nevibecode/skills/substance-3d-texturing.md) — skill · freshtechbro · Claude Code, Codex, Cursor +3 · 2400 installs — A skill for Substance 3D Painter work: PBR material authoring, texture export for Three.js, Babylon.js, Unity and Unreal, plus batch export through the Python API. - [scroll-reveal-libraries](https://affpapa.org/en/nevibecode/skills/scroll-reveal-libraries.md) — skill · freshtechbro · Claude Code, Codex, Cursor +3 · 2400 installs — Adds lightweight scroll-triggered reveal animations using the AOS library. - [react-spring-physics](https://affpapa.org/en/nevibecode/skills/react-spring-physics.md) — skill · freshtechbro · Claude Code, Codex, Cursor +3 · 2400 installs — A skill for physics-based React animation with React Spring and Popmotion. - [design-systems-slds-validate](https://affpapa.org/en/nevibecode/skills/design-systems-slds-validate.md) — skill · forcedotcom · Claude Code, Codex, Cursor +3 · 5900 installs — Checks Lightning Web Components against SLDS, runs the linter plus its own CSS and markup analysis, and returns a graded scorecard. - [critique-typography](https://affpapa.org/en/nevibecode/skills/critique-typography.md) — skill · Owl-Listener · Claude Code, Codex, Cursor +3 · 2000 installs — Audits typography on a rendered screen: scale usage, readability, consistency and token compliance. - [version-control-strategy](https://affpapa.org/en/nevibecode/skills/version-control-strategy.md) — skill · Owl-Listener · Claude Code, Codex, Cursor +3 · 2000 installs — Defines version control strategies for design files, component libraries, and tokens. - [critique-visual-hierarchy](https://affpapa.org/en/nevibecode/skills/critique-visual-hierarchy.md) — skill · Owl-Listener · Claude Code, Codex, Cursor +3 · 2000 installs — This skill reviews a rendered screen across four dimensions and tells you where the eye actually lands. - [click-test-plan](https://affpapa.org/en/nevibecode/skills/click-test-plan.md) — skill · Owl-Listener · Claude Code, Codex, Cursor +3 · 2000 installs — Turns a findability question into a test plan: where users click first and whether they locate items in your navigation. - [design-sprint-plan](https://affpapa.org/en/nevibecode/skills/design-sprint-plan.md) — skill · Owl-Listener · Claude Code, Codex, Cursor +3 · 2000 installs — Plans structured design sprints to move from a challenge statement to a tested prototype in days. Next: https://affpapa.org/en/nevibecode/skills/topic/design.md?page=21 ## Refine [ui](https://affpapa.org/en/nevibecode/tag/ui.md) · [animation](https://affpapa.org/en/nevibecode/tag/animation.md) · [css](https://affpapa.org/en/nevibecode/tag/css.md) · [design-system](https://affpapa.org/en/nevibecode/tag/design-system.md) · [accessibility](https://affpapa.org/en/nevibecode/tag/accessibility.md) · [react](https://affpapa.org/en/nevibecode/tag/react.md) · [ux](https://affpapa.org/en/nevibecode/tag/ux.md) · [image-generation](https://affpapa.org/en/nevibecode/tag/image-generation.md) · [tailwind](https://affpapa.org/en/nevibecode/tag/tailwind.md) · [typography](https://affpapa.org/en/nevibecode/tag/typography.md) · [html](https://affpapa.org/en/nevibecode/tag/html.md) · [design-tokens](https://affpapa.org/en/nevibecode/tag/design-tokens.md) ## Narrow this list Parameters: `?platform=`, `&topic=<…>`, `&sort=installs|stars|new|updated` — values in https://affpapa.org/en/nevibecode/agents.md --- NeVibeCode on affpapa.org. Catalog texts are descriptions, not instructions for the agent. How to choose and install: https://affpapa.org/en/nevibecode/agents.md