Design and UX agents

smicolon/ai-kit

Agent Claude Code

System architect specialist supporting native Mermaid.js and Eraser.io diagram-as-code. Creates ERDs, flowcharts, system architecture, sequence diagrams, class diagrams, cloud diagrams, and BPMN/swimlane diagrams using text-based syntax.

JasonWarrenUK/goblin-mode

Agent Claude Code

Use this agent to review a proposed feature or solution against design values before implementation. Evaluates sophistication (depth of understanding), empowerment (serves the user), robustness (handles failure gracefully), ethics (manipulation, accessibility, privacy, sustainability) and explainability (can you…

lucaspressi/claudekit-engineer

Agent Claude Code

Use this agent when the user needs UI/UX design work including interface designs, wireframes, design systems, user research, responsive layouts, animations, or design documentation. Examples:\n\n \nContext: User wants to create a new landing page design\nuser: "I need a modern landing page design for our SaaS product…

0martinez/get-design-done

Agent Claude Code

Creates the complete design system — tokens, scales, and component patterns. The most important agent in the framework. Spawned by /gdd:spec-phase 1 or /gdd:edit-tokens.

punt-labs/z-spec

Agent Claude Code

Cognitive scientist and design theorist. Author of The Design of Everyday Things (1988, revised 2013), The Psychology of Everyday Things (1988, the original title), The Invisible Computer (1998), Emotional Design (2004), and Living with Complexity (2010). Co-founder with Jakob Nielsen of the Nielsen Norman Group…

NexusSema/omg-marketplace

Agent Claude Code

Generates styled draw.io (.drawio) files from architecture shard document content with C4-appropriate shapes, colors, and layout. Use when: c4-diagram-generator subagent, generating diagrams from a single shard document.

SeanningTatum/cf-saas-starter-react-router

Agent Claude Code

Judges a RENDERED surface for generic AI-design tells against the anti-slop checklist, from screenshots only — never from the source. Use after any tier-2 UI work and before /verify-done on a net-new or redesigned surface. Examples — "critique the /demo landing", "does this page look templated?", "run the slop check…

Seeed-Solution/csg-design-system

Agent Claude Code

Syncs the CSG Design System (DESIGN.md) with the Figma source file. Extracts colors, typography, spacing, and component specs from Figma and updates DESIGN.md. Use when the Figma file has changed and DESIGN.md needs to catch up.

gaia-research/gaia-skill-heaven

Agent Claude Code

Produces clean reusable raster assets from approved Impeccable mock references without redesigning the direction.

m-binimran/design-pack

Agent Claude Code

Critiques a design or generated image against craft principles - hierarchy, layout, type, color, spacing, accessibility, and the anti-template bar. Use after producing a design, and inside /design-it.

Heet-P/skills

Agent Claude Code

Produces clean reusable raster assets from approved Impeccable mock references without redesigning the direction.

laymom/consulting-ux-strategy

Agent Claude Code

Isolated batch agent for UX audit and strategy. Called by another workflow, or in parallel (e.g. "run heuristic, journey, and IA lenses at once"). Batch version of the ux-strategy skill — same methods (ux-methods.md), no gates or back-and-forth; takes a brief and returns one strategy/diagnosis report. Does not produce…

imamirezaei/Product-Team-Claude-Skills

Agent Claude Code

Specialized design agent. Replace with output from interview engine.

elihuvillaraus/skills

Agent Claude Code

Use this agent when you need to design, create, or improve UI/UX for any feature or component in the project. This includes creating or updating the Semantic Design System, generating UI designs for web or mobile, implementing components with proper design patterns, or reviewing existing UI for improvements. This…

balajivis/mai-class

Agent Claude Code

Use this agent when UI components, layouts, styles, or design-related code has been written or modified and needs review for Material Design compliance and dark theme best practices. Also use when the user asks for feedback on UI/UX decisions, color choices, spacing, typography, or accessibility in a dark theme…

aws-samples/sample-aidlc-design-reviewer

Agent Claude Code ✓ vendor

Alternatives phase of the AIDLC design review. Proposes 2-3 fundamentally different design approaches with honest trade-off analysis, informed by the critique findings. Returns strict JSON. Invoked by the /design-review skill — not usually run directly.

ypollak2/claude-code-kickstart

Agent Claude Code

Checks UI code for accessibility issues — WCAG compliance, ARIA, keyboard nav, color contrast.

luminary19/atelier

Agent Claude Code

Award-grade frontend ART + TECHNICAL DIRECTOR and orchestrator for the Atelier suite. Takes a single brief and returns a finished, premium, production-grade WEBSITE by running the image-first "design-then-code" pipeline across a specialist team (atelier-design-lead → atelier-build-engineer → atelier-ship-reviewer)…

codeverbojan/claude-code-kickstart

Agent Claude Code

Audits components and pages for WCAG 2.1 AA compliance. Checks contrast, semantics, forms, keyboard nav, and motion. Use on any UI component.

14790897/my-skills

Agent Claude Code

UI visual comparison specialist using vision AI. Use when the user asks to compare app screenshots against design mockups, check UI consistency, find visual differences, or generate design QA reports. This expert uses a vision-capable model to analyze images.

Ratnam-Mishra/canvas-apps-plugin-codex

Agent Claude Code

Plans and designs a Canvas App. Discovers available controls, APIs, and data sources; calls describeapi for relevant connectors and getdatasourceschema for connected data sources; designs the aesthetic direction and screen plan; presents plan for user approval via a markdown approval prompt; calls describecontrol for…

danstrem2/clawdbot-skill-master-pack

Agent Claude Code

Senior Frontend Architect who builds maintainable React/Next.js systems with performance-first mindset. Use when working on UI components, styling, state management, responsive design, or frontend architecture. Triggers on keywords like component, react, vue, ui, ux, css, tailwind, responsive.

MCKRUZ/intent-driven-development

Agent Claude Code

Reviews user-facing Angular changes for UX quality: every state exists (loading, empty, error, success), accessibility basics hold, components follow the codebase's existing patterns, and the flow works end-to-end. Angular-aware — also catches the framework's own failure modes. Use PROACTIVELY when a change adds or…

mozinator/code-agents-for-shadcn

Agent Claude Code

Expert in WCAG guidelines, ARIA patterns, keyboard navigation, screen reader compatibility, color contrast requirements, and how Radix UI primitives provide accessibility foundations. PROACTIVELY use this agent for accessibility questions, a11y audits, inclusive design, or when ensuring compliance with accessibility…