Best Claude skills for design
Design skills give your agent taste: spacing scales, type hierarchy, color systems and the judgement to say no to generic layouts. The best ones ship a vocabulary ("polish", "bolder", "critique") and reference files your agent reads only when it needs them, so they stay cheap on context.
235 design skills · ranked live · November 2026
The top 10. Ranked by the Alyn Score.
- 1#1
Leonxlnx
Design Taste Frontend
tasteskill 2.5.1, the anti-slop frontend skill. Builds professional company websites at the level of figma.com and x.ai: plain copy in a voice of its own, one system, one section per…
113k5.6MScore 92 - 2#2
affaan-m
Brand Discovery
Run a structured, resumable multi-session brand identity interview across 8 modules (purpose, positioning, audience, personality, voice, narrative, founder tension) using laddering, 5 Whys…
301k1.7MScore 91 - 3#3
Matt Pocock
Prototype
Build a throwaway prototype to answer a design question. Use when the user wants to sanity-check whether a state model or logic feels right, or explore what a UI should look like.
321k33MScore 91 - 4#4
Paul Bakaus
Impeccable
Use when the user wants to design, redesign, shape, critique, audit, polish, simplify, harden, animate, or otherwise improve a frontend interface: websites, landing pages, dashboards…
108k1.9MScore 90 - 5#5
Accessibility
Design, implement, and audit accessible UI to WCAG 2.2 Level AA across Web, iOS, and Android — semantic ARIA roles and labels, accessibility traits and hints, focus management, contrast…
301k1.7MScore 89 - 6#6
Anthropic
Skills
Anthropic
Canvas Design
Create beautiful visual art in .png and .pdf documents using design philosophy. You should use this skill when the user asks to create a poster, piece of art, design, or other static piece…
192k3.8MScore 89 - 7#7
nextlevelbuilder
Design
Comprehensive design skill: brand identity, design tokens, UI styling, logo generation (55 styles, Gemini, Atlas Cloud, or MuAPI AI), corporate identity program (50 deliverables, CIP…
148k932kScore 89 - 8#8
Design System
Token architecture, component specifications, and slide generation. Three-layer tokens (primitive→semantic→component), CSS variables, spacing/typography scales, component specs, strategic…
148k932kScore 89 - 9#9
Anthropic
Skills
Frontend Design
Guidance for distinctive, intentional visual design when building new UI or reshaping an existing one. Helps with aesthetic direction, typography, and making choices that don't read as…
192k3.8MScore 89 - 10#10
UI Styling
Create beautiful, accessible user interfaces with shadcn/ui components (built on Radix UI + Tailwind), Tailwind CSS utility-first styling, and canvas-based visual designs. Use when building…
148k932kScore 89
What makes a great design skill.
Reference material (palettes, type scales, component rules) bundled with the skill.
A review or critique mode, not only a generate mode.
Clear guidance on what not to do. Taste is mostly subtraction.
All 235 design skills.
davila7design-to-code
Pixel-perfect Figma to React conversion using coderio. Generates production-ready code (TypeScript, Vite, TailwindCSS V4) with high visual fidelity. Features robust error handling…
morlutorea-tool-design
Audit, investigate, design, or change REA investigation tools, CLI/MCP contracts, provider capabilities, and Evidence semantics.
Anthropic
Claude Plugins Official
Anthropicfrontend-design
Guidance for distinctive, intentional visual design when building new UI or reshaping an existing one. Helps with aesthetic direction, typography, and making choices that don't read as…
Egonex-AIunderstand-figma
Analyze a Figma file via the Figma REST API and generate an interactive design knowledge graph (pages, screens, components, component sets, instances, design tokens) with a kind:"design"…
gamedev-skillsaudio-design
Implement game audio practice — bus/mixer architecture and gain in decibels, ducking (sidechain), adaptive/dynamic music via layering and re-sequencing, SFX variation, and beat…
Expo
Skills
Expoexpo-ui
Build native UI with the @expo/ui package: real SwiftUI on iOS and Jetpack Compose on Android. Default to @expo/ui for sheets (BottomSheet), pickers, sliders, toggles, menus, and…
gamedev-skillsgame-ui-ux
Design and build game UI/UX — HUDs, menus, and overlays — that survive every screen: anchor- based responsive layout, resolution/aspect scaling and safe areas, keyboard/gamepad focus…
phurynsurvey-design
Writing or reviewing a survey or questionnaire: customer feedback, NPS, CSAT, CES, pricing, market research, an in-app survey. Starts from the decision, asks about facts, pilots it, and…
Vercel
Agent Skills
Vercelweb-design-guidelines
Review UI code for Web Interface Guidelines compliance. Use when asked to "review my UI", "check accessibility", "audit design", "review UX", or "check my site against best practices".
mukul975
Anthropic Cybersecurity Skills
mukul975analyzing-disk-image-with-autopsy
Perform comprehensive forensic analysis of raw (dd), E01, or AFF disk images with Autopsy and The Sleuth Kit, recovering deleted files, examining metadata and embedded artifacts, keyword…
Composiocanvas-design
Create beautiful visual art in .png and .pdf documents using design philosophy. You should use this skill when the user asks to create a poster, piece of art, design, or other static piece…
Jeffallan
Claude Skills
Jeffallankotlin-specialist
Provides idiomatic Kotlin implementation patterns including coroutine concurrency, Flow stream handling, multiplatform architecture, Compose UI construction, Ktor server setup, and…
Jeffallan
Claude Skills
Jeffallanarchitecture-designer
Use when designing new high-level system architecture, reviewing existing designs, or making architectural decisions. Invoke to create architecture diagrams, write Architecture Decision…
Composioartifacts-builder
Suite of tools for creating elaborate, multi-component claude.ai HTML artifacts using modern frontend web technologies (React, Tailwind CSS, shadcn/ui). Use for complex artifacts requiring…
Expo
Skills
Expoexpo-design-system
Build and maintain a design system inside an Expo app - a reusable theme of design tokens (color, spacing, typography, radius, shadow, motion), reusable component structure with…
Expo
Skills
Expoexpo-native-ui
Build beautiful, native-feeling Expo screens. Covers Apple HIG styling, semantic colors, native controls, SF Symbols, media, visual effects, gradients, storage, and responsive layout. For…
Jeffallan
Claude Skills
Jeffallanfullstack-guardian
Builds security-focused full-stack web applications by implementing integrated frontend and backend components with layered security at every level. Covers the complete stack from database…
alchaincyfhuashu-design
花叔Design——用HTML做高保真原型、幻灯片、动画、可视化与专家评审。任何新设计100%先出三个方向初稿给用户选（指定风格/品牌也不豁免），选定后才执行。触发词：做原型、PPT、幻灯片、动画、设计风格、评审、做个HTML页面、UI mockup、导出MP4/GIF、做个好看的。生产级Web App/需后端的系统不适用。
browser-actamazon-product-detail
Amazon product detail page scraper: extract full product data from any open Amazon product detail URL (any /dp/{asin} or /gp/product/{asin} page across all Amazon regional TLDs) — returns…
browser-actebay-item-detail
Extracts full item detail from any open eBay item URL, returning JSON with url, itemNumber, title, subTitle, categories, price, priceWithCurrency, currency, wasPrice, available…
Google Labs
Stitch Skills
Google Labsremotion
Generate walkthrough videos from Stitch projects using Remotion with smooth transitions, zooming, and text overlays
Google Labs
Stitch Skills
Google Labsshadcn-ui
Expert guidance for integrating and building applications with shadcn/ui components, including component discovery, installation, customization, and best practices.
Google Labs
Stitch Skills
Google Labsstitch::react-components
Converts Stitch designs into modular Vite and React components, or syncs/updates existing React components to align with the latest Stitch designs, using system-level networking and…
tw93think
Turns rough ideas into approved, decision-complete plans before coding. Use when planning architecture, judging whether to build, or writing a handoff. Not for bug fixes or small edits.
tw93ui
Produces distinctive production UI and screenshot-grounded visual polish. Use when building or restyling pages, components, or typography. Not for backend logic or data pipelines.
browser-actamazon-product-api-skill
This skill helps users extract structured product listings from Amazon, including titles, ASINs, prices, ratings, and specifications. Use this skill when users want to search for products…
Composiobrand-guidelines
Applies Anthropic's official brand colors and typography to any sort of artifact that may benefit from having Anthropic's look-and-feel. Use it when brand colors or style guidelines, visual…
wanshuiyin
Auto Claude Code Research In Sleep
wanshuiyindse-loop
Autonomous design space exploration loop for computer architecture and EDA. Runs a program, analyzes results, tunes parameters, and iterates until objective is met or timeout. Use when user…
deanpeters
Product Manager Skills
deanpeterslean-ux-canvas
Guide teams through Lean UX Canvas v2. Use when framing a business problem, surfacing assumptions, and defining what to learn next.
scenario-labsscenario-inspiration
Use when a creative task has no direction yet: finding inspiration, exploring looks or styles, proposing concept directions to pick between, building a moodboard or reference board, doing…
wondelai
Skills
wondelaiconversion-optimization
Guided journey from a leaking conversion flow - landing page, signup, checkout, or in-app onboarding - to a measured, tested funnel. Orchestrates six skills phase by phase - lean-analytics…
wondelai
Skills
wondelaicreate-app
Guided journey from a raw app idea to a validated, cleanly architected first version that ships on a sustainable cadence. Orchestrates ten skills phase by phase - lean-startup…
wondelai
Skills
wondelaicreate-business
Guided journey from raw idea to a validated, positioned, priced business with a chosen beachhead. Orchestrates ten skills phase by phase - jobs-to-be-done, mom-test, design-sprint…
alirezarezvani
Claude Skills
alirezarezvanics-ux-researcher
../../../agents/product/cs-ux-researcher.md
heydamirunslop
Turns vibecoded, AI-looking UI into a designed interface with its own character. Finds a direction from the product itself, then fixes spacing, color, icons, copy, type, layout, details…
zubair-trabzadageo
GEO-first SEO analysis tool. Optimizes websites for AI-powered search engines (ChatGPT, Claude, Perplexity, Gemini, Google AI Overviews) while maintaining traditional SEO foundations…
Design skills, explained.
Also searched as: claude design skills, ui ux skills, design system skill, figma skill.
What are the best Claude skills for design?
Right now the top-ranked design skills on Alyn are Design Taste Frontend (Leonxlnx), Brand Discovery (affaan-m), Prototype (Matt Pocock). Rankings combine GitHub stars, installs, freshness and depth, and update live.
What is the best Claude skill for UI design?
Taste Skill, Impeccable, UI UX Pro Max and Anthropic's frontend-design are the most installed design skills on Alyn. Rankings update live from GitHub stars and skills.sh installs.
Can a skill replace a designer?
No. A good design skill raises the floor of what your agent produces and gives it a shared vocabulary with you. Direction still comes from you.
How do I install a design skill?
Run npx skills add owner/repo in your project, or copy the folder with SKILL.md into ~/.claude/skills. Every skill on this page has a ready-to-copy command.
More in Design & content
Design skills for your agent