Design & frontend
16,188 rows, by stacks then stars
1,697 of these skill files have been read, by 1,179 distinct authors, and what they tell an agent counted. What Design & frontend authors agree on, and what they forbid
talknerdytome-labs/wiggle-claude-skill Skill
no license21★Claude Skill for Animating Logos
gaia-react/gaia/.claude/skills/a11y-fixes Skill
21★ repoThe Claude-native foundation you build your whole app on. React frontend handled, your backend builds on top. Strict tooling, pre-commit gates, code-review audit before every merge.
pimenov/codex-first-skills-pack/skills/api-and-interface-design Skill
no license21★ repoПубличный пакет инженерных skills для Codex
artgas1/infostyle-skill/skills/infostyle Skill
21★ repoClaude Code skill for editing Russian text using Ilyakhov's information style (инфостиль). First-ever AI skill based on 'Пиши, сокращай' methodology.
devnomad-byte/cosmosmith/plugins/cosmosmith/skills/cosmosmith-architect Skill
20★ repoGive AI coding agents product, spec, task, QA, and release workflows in one command.
Kappaemme-git/build-startup-brand Skill
20★Build a distinctive startup brand identity with Codex and receive an openable visual report.
snowyowlmia/persona-compass Skill
19★AI skill: build personality models of colleagues, predict behavior, get ready-to-use communication scripts. Privacy-first codename system. Works on Claude Code & Claude.ai. Zero dependencies.
Typescript react nextjs patterns
leejpsd/typescript-react-nextjs-patterns Skill
18★Production-grade Agent Skill for TypeScript, React & Next.js — decision guides, hard rules, and debugging playbooks for AI coding agents (Claude Code, Cursor, Codex)
devPnal/design-system-is-all-you-need/design-system-is-all-you-need Skill
18★ repoA collection of guideline prompts created to refine the often awkward design traits of generative AI by applying a modern design system, intended for use in Claude, Codex or other vibe coding tools
trabian/fluxwing-skills/skills/fluxwing-component-creator Skill
18★ repoClaude skills for generating ASCII components and screens for humans to review, and AI to build from.
Nisus74/pencil-skill/skills/pencil-design Skill
18★ repoAI coding skill plugin for pencil.dev (.pen) design files via the Pencil MCP server that works with Claude Code, Cursor, Codex, and Gemini CLI
master5d/claude-design-skills/skills/baseline-ui Skill
no license18★ repoDesign-focused Agent Skills for Claude Code: UI/UX, interface design, typography, and motion. Emil Kowalski-inspired.
Webba-Creative-Technologies/forge/skills/forge Skill
17★ repoA React component library with built-in motion, themeable tokens, and AI skill packs for Claude Code and Cursor.
Fpga hardware design and review guide
cobbpeng/fpga-hardware-design-and-review-guide Skill
17★FPGA hardware design guide based on real-world projects. Covers SystemVerilog, Vivado workflow, timing closure, CDC handling, and Xilinx 7 series device selection. Perfect for AI coding assistants and FPGA developers.
jaaaaaaaaaaack/custom-skills/animation-review Skill
no license16★ repoPublic repo for my custom-built claude skills (currently just animation-review)
jackspace/ClaudeSkillz/skills/ai-elements-chatbot Skill
16★ repoClaudeSkillz: For when you need skills, but lazier
mcpware/ui-annotator-mcp/io.github.mcpware/ui-annotator-mcp MCP server
16★ repoAnnotates any web page with hover labels for AI assistants — zero extensions, any browser
mattbx/shadcn-skills/skills/shadcn-component-discovery Skill
15★ repoSkills for building better shadcn/ui apps. Discover 1,500+ existing components before building custom, and review components against shadcn patterns & theme styles (Vega, Nova, Maia, Lyra, Mira).
Xialiang98/design-visual-frontend Skill
15★Agent Skill for distinctive frontend design, responsive implementation, visual review, and browser-verified UI quality.
EliaAlberti/ux-audit-skill Skill
15★Heuristic UX audits from screenshots for Claude Code & Codex with severity-rated findings, heuristic citations, annotated screenshots, structured reports.
oneworks-ai/app/.oo/skills/ui-design-memory Skill
15★ repoOne Works application monorepo for AI agents, plugins, desktop, web, CLI, and Relay.
2389-research/landing-page-design/skills Skill
14★ repoCreate high-converting, visually distinctive landing pages with Vibe Discovery process and anti-AI-slop principles
piyushverma0/android-agent-skills/skills/accessibility Skill
14★ repo27 Android skills for AI agents (Claude Code, Codex, Cursor). Fixes Supabase auth, Hilt errors, design inconsistency, kapt→ksp, missing UiState states. Reduced my token bills 5×. FitGenZ AI shipped in 18 days.
cis2042/product-design-harness/skills/product-design-harness Skill
14★ repoAgentic Design Process with Designer-in-the-Loop product judgment across User, Evidence, and Business flows.
rastian/design-thinking-skills Skill
no license13★A Claude Code skill that guides any team through Design Thinking, from user research to shipped solution. Includes phase-by-phase methods, templates, facilitation scripts, and role-specific guidance for designers, founders, and business leaders.
kevinnft/ai-agent-skills/skills/addyosmani/api-and-interface-design Skill
13★ repo191 attribution-first agent skills for Hermes Agent, Claude Code, Cursor — one installer, 28 categories, searchable catalog. See NOTICE for upstream attribution.
msrbuilds/animate-css-skill/animate-css-skill Skill
no license13★ repoClaude Code skill that adds Animate.css animations to HTML, React/JSX, and WordPress PHP templates — with scroll-trigger, RTL, and reduced-motion support
SlideSpeak/slide-design-skill Skill
13★AI presentation engine. Describe your deck and the look, it derives a bespoke style and renders polished 1920x1080 HTML slides with real charts, tables and imagery. Agent skill: npx skills add SlideSpeak/slide-design-skill
FridrichMethod/awesome-skills/skills/aav-vector-design-agent Skill
no license13★ repoCurated, auto-synced collection of 2,000+ Claude Code & Codex skills for AI4Protein, bioinformatics, AI development, and academic paper writing. One curl command installs them all.
miapre/html-to-figma-design-system/io.github.miapre/html-to-figma-design-system MCP server
13★ repoTranslate HTML prototypes into Figma using your design system's real components and tokens.
tinh2/skills-hub-registry/analysis/508-audit Skill
no license12★ repoOpen registry of community-contributed AI coding skills (SKILL.md files) — daily-synced to skills-hub.ai. Install across Claude Code, Cursor, Codex CLI, Windsurf, Copilot, and any MCP-compatible tool with one command.
Agents365-ai/agent-native-design/skills/agent-native-design Skill
no license12★ repoAgent-Native CLI design & review skill — design CLIs that serve humans, AI agents, and orchestration systems simultaneously
rastian/interaction-design-skills Skill
no license12★A Claude skill for interaction design -> flows, states, micro-interactions, affordances, feedback, and IxD principles for product, UX, UI, and service designers.
pivyme/suiperpower/core/skills/build/brand-design Skill
12★ repoBuild something meaningful, on Sui. A superpower for AI coding agents (Claude Code, Codex, Cursor, Grok Build) to ship real products on Sui.
neonwatty/css-animation-skill Skill
12★A Claude Code skill that generates self-contained HTML/CSS animations of app features for walkthroughs, demos, and onboarding
alper-dev/build-for-good-ux-skill Skill
12★Agent skill for building UIs with proper loading states, error handling, empty states, form UX, and graceful degradation
timhok/hmi-design/hmi-design-full Skill
12★ repoHuman-machine interface (HMI) design skill for AI agents - better slop for better world
helderberto/agent-skills/skills/a11y-audit Skill
12★ repoMy personal SDLC toolbelt for AI coding agents — PRD to ship.
Creating reanimated animations
estevg/skills/plugins/creating-reanimated-animations/skills/creating-reanimated-animations Skill
12★ repoReact Native Reanimated animation skill
yshishenya/stitchflow/skills/stitch-design-local Skill
11★ repoStitchFlow turns prompts into UI directions, Tailwind-friendly HTML, and screenshots across Codex, Claude Code, OpenClaw, GitHub Copilot, and Gemini CLI.
AgentsORG/design-engineering/skills/design-engineering Skill
11★ repoA skill graph for design engineering: animation, transitions, taste, typography, color, components, anti-patterns.
evist0/okf-matt-skills/codebase-design Skill
11★ repoMatt Pocock's agent skills, reworked on Google's Open Knowledge Format
metaskills/skill-design-guide Skill
no license10★Claude skill for building Claude skills. An interactive 9-step workflow distilled from Anthropic's complete guide — covering use cases, frontmatter, instructions, design patterns, testing, and distribution.
holy-templar/AD-RESTYLER Skill
10★Restyle any ad into any visual style with one prompt — free Claude skill for Google Omni Flash video-to-video.
sshahzaiib/senior-designer-skill Skill
10★Evidence-based senior product designer skill for Claude Code — turns any UI/app build into research-driven, accessible, non-generic design. Sourced from 158 vetted publications (Apple HIG, WCAG, NN/g, Refactoring UI) with a scored quality checklist.
rahamanbinujit/claude-design-engine/.gemini Skill
no license10★ repoYour AI Creative Director. 190+ design styles, AI photo generation, self-reviewing quality system, and 4K pixel-perfect export. Design social media posts, carousels, YouTube thumbnails, websites, and PDFs — just describe what you want. Works with Claude Code, Cursor, Codex, Gemini CLI. Built through 300+ real design experiments by Rahaman Bin Ujit.
FileMaker XMLsnippet Layout Claude Skill
andykear/FileMaker-XMLsnippet-Layout-Claude-Skill Skill
no license10★Reverse-engineered specification of FileMaker's undocumented layout XML format (fmxmlsnippet LayoutObjectList). All 18 object types covered, flags decoded, element order confirmed, verified against production layouts. Packaged as a Claude skill that generates pasteable layout XML.
molauu/svg-character-animator Skill
10★Agent Skill for production-quality SVG character animation — morph state machines, idle motion, SwiftUI export
stareezy-1/frontend-architecture-skill/skills/frontend-architecture Skill
10★ repoSix portable, framework-agnostic frontend Agent Skills (SKILL.md) for the React & React Native ecosystem: architecture, SEO, Lighthouse performance gate, typed data contracts, optimistic mutations, and observability. About Me : https://stareezy.tech
Heiberg-Industries/designbrief Skill
10★Design guardrails, not templates. A library of UI design direction files that give LLMs (and humans) the context to build tasteful, consistent interfaces in any style.
pudge-studio/pudge-ui/io.github.pudge-studio/pudge-ui MCP server
10★ repoQuery pudge-ui — 93 skeuomorphic 2000s-era UI component specs — for coding-agent context.
rudraptpsingh/figbridge/io.github.rudraptpsingh/figbridge MCP server
10★ repoFree, local MCP bridge for Figma — HTML, CSS, Tailwind, tokens, agent handoff bundles.
nonlinear-xyz/factory-kit/skills/factory-animation Skill
9★ repoPersonal Claude Code factory — synthesized cross-build skills, specialist subagents, and slash commands. Phase 0.
Surya17155/Replica Skill
9★Turn any screenshot/design reference into a precise, copy-paste-ready developer prompt. Upload a screenshot → get exact hex colors, Tailwind classes, animation specs, and component structure — ready for Lovable, Bolt, Replit, or Cursor.
Notysoty/openagentskills/skills/accessibility-audit-helper Skill
9★ repoA community-driven library of reusable AI agent skills for Claude Code, Cursor, Codex, Cline, and more.
AlterLab-IEU/AlterLab-FC-Skills/skills/cdm/alterlab-cdm-animation-previz Skill
9★ repo🎓 72 production-grade Claude AI skills for communication students — PR & advertising, cinema, new media, GenAI production, visual communication & research methods. Built by AlterLab.
ivan-magda/mobile-design-skills/mobile-design-android Skill
9★ repoMobile design skills for iOS (Liquid Glass) and Android (M3 Expressive) that help AI agents generate platform-native UIs
Dragoon0x/everything-design-taste/skills/ab-testing-design Skill
9★ repoA taste system for AI agents. 288 skills, 80 agents, 12 rules, and 8 hooks that turn generic AI output into work with genuine design quality. Anti-slop detection, typography craft, color systems, brand voice, product strategy, and 50+ specialized reviewers across UI, industry, platform, and content domains.
emaraschio/cursor-commands/.cursor/skill-contracts/accessibility-audit Skill
9★ repoProduction-grade Cursor slash commands with paired skill contracts, behavioral evals, and ship-gate CI. Install as a user plugin.
alphaparkinc/kyoto-design-philosophy Skill
no license9★GenPark skill: Apply Kyoto's design principles (Ma, Shu-Ha-Ri, Ichigo Ichie) to AI agent architecture and product decisions ??as practiced by Jobs, Zhao, Last, and Cheny.