Design and UX skills

agarzon/moonshine-v3-skills

Skill Claude CodeCodex

Use when customizing MoonShine v3 layouts, menus, colors, icons, assets, pages, dark mode, branding, or overall admin panel design.

amannayak/skills

Skill Claude Code

Use for designing, auditing, polishing, or implementing Expo/React Native mobile UI and UX across iOS and Android. Covers screens, navigation, tabs, modals, onboarding, safe areas, typography, gestures, haptics, lists, accessibility, platform conventions, design tokens, Figma/screenshot conversion, and…

aakashDesign/superskilled

Skill Claude CodeCodex

Use this skill whenever a designer receives feedback on their work and needs help interpreting it before deciding what to do next. Trigger when a user shares stakeholder or reviewer comments, when they're stuck after a review session and don't know what to change. This skill is especially useful for designers working…

Staxing799/ui-page-generation-skills

Skill Claude CodeCodex

Orchestrate high-quality front-end page generation from short product prompts. Use when Codex needs a single main skill that coordinates UI structure, visual hierarchy, and natural product copy for landing pages, dashboards, app screens, workspaces, settings pages, analytics views, tables, and similar interfaces.

sissname/ai-image-diagnosis

Skill Claude CodeCodex

Diagnose AI-generated or AI-assisted images that "look off", feel generic, fail commercially, or need prompt/image-to-image repair. Use when the user uploads or references an image and asks why it is not good enough, how it differs from better references, which professional roles would critique it, how to improve…

BEFOREVIBE/beforevibe-skill

Skill Claude CodeCodex

Grill an app idea before any code is written — two waves of hard product questions, each with a recommended answer the user edits or accepts — then hand off to the BEFOREVIBE MCP connector for the visual storyboard, production-ready PRD, logo and screen mockups. Use when the user shares a new app or product idea, asks…

solankiharsh/craftsman-skills

Skill Claude CodeCodex

Full maturity upgrade workflow for an existing app. Runs polish-audit → grill-me (against audit) → design-brief (with baseline) → design-tokens (additive) → brief-to-tasks (with regression guards) → frontend-design → design-review (baseline diff) → MATURITYREPORT.md. Use this for upgrading vibe-coded apps, not…

owenmorgan/claude-skills

Skill Claude Code

Generate favicon.ico and a complete icon set from a source PNG. Optimised for Next.js App Router but works for any web project.

customerio/ai-skills

Skill Claude CodeCodex

Analyze email HTML for accessibility issues, combining mechanical rule-based checks (lang/dir attributes, alt text, contrast ratios, heading structure, VML, tables, landmarks) with judgment-based analysis (alt text quality, semantic structure, link text quality, visual/interaction concerns like touch targets and font…

mgustofson/norman

Skill Claude CodeCodex

A production design agent that brings craft, polish, and precision to design outputs. Use this skill when the user wants to refine, polish, or finalize a design — including improving typography, spacing, layout structure, visual hierarchy, color systems, component quality, responsive behavior, or overall design craft.…

Dragoon0x/usemindit

Skill Claude CodeCodex

Analyze a design or screen for clarity — whether a stranger can read the intent in five seconds. Use this whenever the user asks about hierarchy, what stands out, what gets noticed first, whether a CTA is obvious, whether labels make sense, why users miss something on a screen, or why a layout feels cluttered or…

elhombretecla/penpot-skills

Skill Claude Code

Design production-grade UI from scratch in Penpot, acting as a senior visual designer. Use when an agent needs to create an interface from a brief, concept, or description — without an existing design system or codebase to translate from. This skill makes real aesthetic decisions, builds a coherent design language…

ariel-lee-1023/Color-Matching-Consultant

Skill Claude CodeCodex

Color matching, palette construction, and pigment-mixing advice that starts with value, context, and material. Use to build or critique a palette, mix a target in a specified medium, troubleshoot muddy color, compare colors, or develop a period or culturally situated palette. Distinguishes perceptual interaction…

amir0135/github-copilot-use-cases

Skill Claude CodeCodex

Analyze Azure resource groups and generate detailed Mermaid architecture diagrams showing the relationships between individual resources. Use this skill when the user asks for a diagram of their Azure resources or help in understanding how the resources relate to each other.

bl1nk-bot/agent-library

Skill Codex

Translates Figma designs into production-ready application code with 1:1 visual fidelity. Use when implementing UI code from Figma files, when user mentions "implement design", "generate code", "implement component", provides Figma URLs, or asks to build components matching Figma specs. For Figma canvas writes via…

Jonathangadeaharder/AgentBible

Skill Claude CodeCodex

Build, redesign, or critique presentation slides and decks that are grounded in cognitive science — Assertion-Evidence structure, minimal cognitive load, Picture-Superiority, strict visual hierarchy, WCAG accessibility — and free of generic "AI-slop." Use this whenever the user wants to make a presentation, build or…

Nagraj-13/Kanso-UI

Skill Claude CodeCodex

Implements "Architectural Constructional Interface Design" (ACID) — the dark, technical-blueprint/engineering-schematic UI aesthetic used by dev portfolios and component registries such as chanhdai.com (full-bleed hairline rules, diagonal-stripe section dividers, bordered panel grids with persistent vertical rail…

aaoa-dev/Sleak

Skill Claude CodeCodex

Design-decision guide for intentional product UI and marketing surfaces. Use when creating, reviewing, or refining interface hierarchy and craft, especially when a screen feels generic, noisy, inconsistent, or lacks a clear primary action. Routes to focused references by task; use the full checklist only for broad or…

shahid0/mobile-development-ai-skills

Skill Codex

Quality-first agy UI operator for rough user intent: inspect product/code context, gather web or pwm research when useful, write decisive creative briefs, run agy, review harshly, and refine until the visible Flutter, SwiftUI, or web UI is genuinely strong. Use for premium UI generation, redesigns, design systems…

limouren/agent-things

Skill Claude CodeCodex

Design and edit UI layouts in Pencil.app .pen files. Use when working with .pen design files, creating UI mockups, generating code from designs, or when user mentions Pencil app. Supports reading designs, creating/editing layouts, taking screenshots for validation, and extracting design tokens.

rxdaozhang/product-reverse

Skill Claude CodeCodex

Use when the user provides a URL to a web product and wants to reverse-engineer it, analyze its UI/UX, discover its tech stack and API surface, and produce a comprehensive report plus actionable design document for building a similar product. Triggers on requests like "analyze this product", "reverse engineer this…

Ruzenie/RUI-agentskills

Skill Codex

A coordinator for the full user-interface design process, from choosing an approach through review and self-assessment. It connects these stages into one workflow and produces a shared report.

aws-samples/sample-aidlc-design-reviewer

Skill Claude Code ✓ vendor

Run a full AIDLC design review (Critique → Alternatives → Gap Analysis) over a project's aidlc-docs and write Markdown + HTML reports. Use when the user asks to review their design, run a design review, critique their AIDLC design artifacts, or check design completeness. Replaces the legacy single-agent reviewer.

Mattdgn/config_cc

Skill Claude Code

Provides complete shadcn/ui component library patterns including installation, configuration, and implementation of accessible React components. Use when setting up shadcn/ui, installing components, building forms with React Hook Form and Zod, customizing themes with Tailwind CSS, or implementing UI patterns like…