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.
600 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…
Pack301k1.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.
Pack321k33MScore 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…
Pack108k1.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…
Pack301k1.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…
Pack192k3.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…
Pack148k932kScore 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…
Pack148k932kScore 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…
Pack192k3.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…
Pack148k932kScore 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 600 design skills.
ferdinandobons
Startup Skill
ferdinandobonsstartup-design
Design, validate, and plan a startup from scratch. Covers market research, competitive analysis, business model, brand identity, product definition, financial projections, and validation…
AI-Builder-Clubvisual-flow-gif
Create animated flow diagrams from articles, workflow notes, architecture sketches, or process descriptions using a JSON specification and a local Python/Pillow renderer. Use when the user…
irinabuht12-ossbrand-answer-monitoring
Track how AI assistants describe your brand over time and catch wrong, outdated, or damaging claims. Claude builds your monitoring prompt set, compares runs week over week, and drafts the…
abdiraimov-otabekdashboard-design
Clean, honest dashboard UI for web and SwiftUI — KPI cards, charts, heatmaps, bullet graphs, comparison periods, ranked breakdowns, date range pickers, filters, empty and loading states…
Cold-IQ
ColdIQ S GTM Skills
Cold-IQdesign-studio
Interactive launcher for design work. Use when the user invokes /design-studio or says "lance le studio", "design studio", "je veux designer un truc". Prints the studio banner, asks what to…
Microsoftint-patterns
Pattern library for Copilot Studio agent design. Contains proven and recommended implementation patterns with YAML examples. Used by the Advisor agent to suggest patterns and by the Author…
tuzhechen2005kinetic-reel
Make kinetic-typography motion reels (MP4) in code: showreels, portfolio or work reels, product promos, intro films, "motion design"-style videos with bold condensed type, HUD micro-type…
Microckapplying-brand-guidelines
This skill applies consistent corporate branding and styling to all generated documents including colors, fonts, layouts, and messaging
Prat011canvas-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…
lingzhi227
Agent Research Skills
lingzhi227experiment-design
Design experiment plans with progressive stages — initial implementation, baseline tuning, creative research, and ablation studies. Plan baselines, datasets, hyperparameter sweeps, and…
sunchaokun
PPT Design Skill
sunchaokunppt-design-skill
Design, generate, review, and revise editable PowerPoint presentations through a rigorous brief-to-PNG workflow using the public pptx-designer Python library.
lingxling
Awesome Skills Cn
lingxlingskill-creator
Guide for creating effective skills. This skill should be used when users want to create a new skill (or update an existing skill) that extends Claude's capabilities with specialized…
lingxling
Awesome Skills Cn
lingxlingwebapp-testing
Toolkit for interacting with and testing local web applications using Playwright. Supports verifying frontend functionality, debugging UI behavior, capturing browser screenshots, and…
Prat011artifacts-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…
mhattingpetedashboard-creator
Create HTML dashboards with KPI metric cards, bar/pie/line charts, progress indicators, and data visualizations. Use when users request dashboards, metrics displays, KPI visualizations…
mhattingpeteflowchart-creator
Create HTML flowcharts and process diagrams with decision trees, color-coded stages, arrows, and swimlanes. Use when users request flowcharts, process diagrams, workflow visualizations, or…
mhattingpetetechnical-doc-creator
Create HTML technical documentation with code blocks, API workflows, system architecture diagrams, and syntax highlighting. Use when users request technical documentation, API docs, API…
BrianRWagner
AI Marketing Claude Code Skills
BrianRWagnerai-discoverability-audit
Audit how a brand appears in AI-powered search (ChatGPT, Perplexity, Claude, Gemini). Use when user mentions "AI search," "how do I show up in ChatGPT," "AI discoverability," "AEO," "LLM…
Microckartifacts-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…
qufei1993dsh-client-ui-ux
设计、实现或审查客户端 UI、响应式布局、交互状态、焦点或失败反馈时使用，结合真实运行界面验证用户体验。
appariciojunior
Video Editor Skills
appariciojuniormusic-and-sound
Scores a vlog with Epidemic Sound - one music cue per section edited to exact length, a ducking envelope baked into one bed (quiet under speech, up on B-roll), and tasteful transition sound…
arpitg1304
Robotics Agent Skills
arpitg1304robot-perception
Comprehensive best practices for robot perception systems covering cameras, LiDARs, depth sensors, IMUs, and multi-sensor setups. Use this skill when working with RGB image processing…
arpitg1304
Robotics Agent Skills
arpitg1304robotics-design-patterns
Architecture patterns, design principles, and proven recipes for building robust robotics software. Use this skill when designing robot software architectures, choosing between behavioral…
arpitg1304
Robotics Agent Skills
arpitg1304ros1
Best practices, design patterns, and common pitfalls for ROS1 (Robot Operating System 1) development. Use this skill when building ROS1 nodes, packages, launch files, or debugging ROS1…
irenerachel
Visual Style Ppt Skill
irenerachelvisual-style-ppt
Create style-driven slide images strictly with the Image 2.5 model, assemble those images into image-only PPTX decks, and manage reusable visual style libraries from documents or visual…
lingzhi227
Agent Research Skills
lingzhi227algorithm-design
Design algorithms with LaTeX pseudocode and UML diagrams. Generate algorithmic environments, Mermaid class/sequence diagrams, and ensure consistency between pseudocode and implementation…
Neeeophytee
Finding Unknowns Skills
Neeeophyteebrainstorm-prototypes
Generate several genuinely different throwaway variations (designs, approaches, drafts) for the user to react to. Use when the user can only recognize what they want by seeing it — visual…
Prat011brand-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…
appariciojunior
Video Editor Skills
appariciojuniorfigma-roundtrip
Keeps a video motion-graphics kit and its editable Figma boards in sync - the creator designs and tweaks in Figma, Claude ports the changes into the Remotion components and brand tokens…
shawnpang
Startup Founder Skills
shawnpangarchitecture-design
When the user needs to design or evaluate system architecture — service boundaries, data models, API contracts, infrastructure topology, database selection, or dependency analysis. Also…
shawnpang
Startup Founder Skills
shawnpangemployer-brand
When the user needs to create or improve content that shapes how candidates and the public perceive the company as a place to work.
skilld-devskilld-tui-design
Designs and verifies skilld CLI output, terminal pickers, and full-screen flows. Use for terminal colours, loading feedback, keyboard controls, layout, errors, or end-to-end CLI UX reviews.
ziguishianxhs-visual-director
Use this skill when planning, redesigning, or reviewing Xiaohongshu carousel visuals, covers, 3:4 image posts, page-by-page visual direction, image-generation prompts, style selection…
shawnpang
Startup Founder Skills
shawnpangfounder-thought-leadership
When the user wants to build personal brand, thought leadership, or IP as a founder on Twitter/X or LinkedIn. Also use when the user mentions "founder brand", "personal content", "build…
Gentleman-Programming
Gentleman Skills
Gentleman-Programmingtailwind-4
Tailwind CSS 4 patterns and best practices. Trigger: When styling with Tailwind - cn(), theme variables, no var() in className.
huangserva
Skill Prompt Generator
huangservadesign-master
平面设计主控 - 自动生成平面设计提示词，支持海报、logo、插画等多种设计类型
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