Rules for an AI coding agent to filter out generic AI-generated UI designs, text, and code.
Tools for designing UI with Claude Code
Left alone, coding agents tend to produce the same interface every time: centered hero, purple gradient, rounded cards. The repos here add design guidance to Claude Code and similar agents, as skills, rule files or MCP servers that supply components and critique.
This space moves week to week, so the list is ranked by momentum first. Most entries are small and easy to try: copy a skill folder or add one server to your config, then compare the output on a screen you know well.
Updated 4 min ago
- Repos tracked
- 43
- New this week
- +15
- added to the list
- Stars gained in 30 days
- +43.9k
- across 27 ranked repos
- Updated
- Oct 20, 2026
Rising newcomers
16 newcomersCreated in the last 90 days and gaining at least 20 stars this week.
UI design skill for Claude Code, Codex and other AI agents: explore distinct directions, compare them side by side, refine against real screenshots. 给 AI Agent 用的 UI 设计 Skill。
An agent skill that builds award-caliber websites from one line
An agent skill for building premium, immersive, scroll-driven websites. Works with Codex, Claude Code, and other coding agents. Also available as a Claude Code plugin.
Better judgment. Better taste. Less ceremony. System instructions and source-aware steering for GPT in Codex.
Review code 100X faster. Lens draws every PR as animated architecture and data-flow walkthroughs, inside the pull request itself. Use it as a GitHub App, GitHub Action, CLI, or a Skill for your coding agent
24 open-source agent skills that turn taste into instructions — ten genre identities, each proven by a same-brief before/after demo
Free, open-source MCP server that gives AI coding agents (Claude Code, Codex, Cursor, OpenCode, ZCode…) design inspiration from award-winning websites — search with real screenshots, pull design DNA, capture and record live sites. A Mobbin alternative. No API key.
400 interactive UI elements you can try live, then copy as an AI prompt or working code: 200 interface parts and 200 website sections and animations. Light/dark, MIT.
Unofficial Claude Skill derived from the book Refactoring UI — a design rulebook and diagnostic layer for web UI. 151 tracked rules, design token generation, and Tailwind mappings.
Opinionated Oxlint rules for rejecting low-evidence TypeScript and JavaScript patterns
A builder, not just a researcher. Agent skills that turn top-grossing app patterns into native-quality mobile screens.
Compose a full-stack TypeScript stack and get a cutting-edge, verified project made for AI coding agents, with type safety, lint, and tests built in. | 自由组合全栈 TypeScript 技术栈,得到一个前沿、经过验证、为 AI 编码智能体打造的项目,内置类型安全、lint 与测试。
Agent skills and design systems from design.how. Build a design system from your app, use agents to ship UI, enforce it in CI.
Make your agents talk human. ADHD-friendly output styles for Claude Code, Codex, and others. So you can pay attention, not tokens.
Take a real UI component apart. A Claude Code skill + runtime that explodes a live component into paint layers, states and tokens. Nothing is redrawn, no number is typed.
How this list is ranked
60% momentum, 40% health. Newcomers: created in the last 90 days with ≥ 20 stars this week.
How the score is computed
- Health (0–100) reflects release cadence, recent commit activity and the number of active contributors.
- Momentum (0–100) is stars gained in 30 days ÷ √(stars before), scaled within this collection, so a small project growing fast can outrank a large one.
- Newcomers are listed only in their own block, so a repo never appears twice.
- Several repos from the same owner are grouped under that owner’s best-ranked project.
- Members come from matching rules (GitHub topics, keywords in the description and README) plus a short hand-kept include and exclude list. The ranking is recomputed every hour from public GitHub activity.
Ranking
27 reposRanked by momentum, then health
- Rank 1
nextlevelbuilder/ui-ux-pro-max-skillOpen nextlevelbuilder/ui-ux-pro-max-skill on GitHub (opens in new tab)
An AI skill that provides design intelligence for building professional UI/UX across multiple platforms.
+9.1k stars in 30 days −10% vs previous 30 days Score 87 - Rank 2
Leonxlnx/taste-skillOpen Leonxlnx/taste-skill on GitHub (opens in new tab)
Agent skills that give coding agents taste: art direction, reference images and a browser check instead of generic AI pages
+11.3k stars in 30 days +13% vs previous 30 days Score 86 - Rank 3
nexu-io/open-designOpen nexu-io/open-design on GitHub (opens in new tab)
The 1st Collaborative AI Design Agent Workspace. Local-first and open source. Create motion, prototypes, websites, apps, dashboards, presentations, images, and videos with your team and AI agents. Share work, exchange feedback, and iterate together in one workspace.
+5.9k stars in 30 days −21% vs previous 30 days Score 85 - Rank 4
awdr74100/figwrightOpen awdr74100/figwright on GitHub (opens in new tab)
Free, two-way Figma MCP server. Turn designs into framework-aware code, and push code back to the canvas. Works with Claude Code, Cursor, Codex, and any MCP client.
+298 stars in 30 days +10% vs previous 30 days Score 75 - Rank 5
dickwu/apple-design-skillOpen dickwu/apple-design-skill on GitHub (opens in new tab)
Cross-platform UI/UX design reviewer based on Apple HIG. Works with Flutter, Tauri, Electron, React Native. Compatible with Claude Code, Cursor, Codex.
+970 stars in 30 days +62% vs previous 30 days Score 74 - Rank 6
JCodesMore/ai-website-cloner-templateOpen JCodesMore/ai-website-cloner-template on GitHub (opens in new tab)
Clone any website with one command using AI coding agents
+2.5k stars in 30 days +20% vs previous 30 days Score 74 - Rank 7
plugin87/ux-ui-agent-skillsOpen plugin87/ux-ui-agent-skills on GitHub (opens in new tab)
Turn Claude into a senior design architect: DTCG tokens, 52 components, WCAG 2.2 AA-AAA, 138 design systems, any-framework code, and 50 objective gates that fail the build instead of faking success.
+1.1k stars in 30 days +16% vs previous 30 days Score 73 - Rank 8
AThevon/genjutsuOpen AThevon/genjutsu on GitHub (opens in new tab)
Creative coding skills for Claude Code, claude.ai and Cowork. Motion, micro-interactions and design systems across Web (GSAP, Motion, Three.js, CSS), Android (Jetpack Compose) and Apple (SwiftUI). Proposes an interaction thesis you approve before it writes any code. Anti-AI-slop.
+243 stars in 30 days +151% vs previous 30 days Score 68 - Rank 9
LottieFiles/motion-design-skillOpen LottieFiles/motion-design-skill on GitHub (opens in new tab)
Universal motion design principles for AI agents — timing, easing, choreography, and Disney animation principles adapted for UI
+662 stars in 30 days +73% vs previous 30 days Score 66 - Rank 10
MrGeDiao/shuorenhuaOpen MrGeDiao/shuorenhua on GitHub (opens in new tab)
说人话|中文优先的去 AI 味改写 skill:保事实、分场景、改完可直接发。Chinese-first rewrite skill for Codex / Claude Code / Cursor / ChatGPT — removes AI tone, preserves facts.
+382 stars in 30 days −42% vs previous 30 days Score 64
- Rank 11
VoltAgent/awesome-design-mdOpen VoltAgent/awesome-design-md on GitHub (opens in new tab)
A collection of DESIGN.md files analysis by popular brand design systems. Drop one into your project and let coding agents generate a matching UI.
+6k stars in 30 days −19% vs previous 30 days Score 58 - Rank 12
superdesigndev/superdesign-skillOpen superdesigndev/superdesign-skill on GitHub (opens in new tab)
The design skill for Claude Code, Cursor and any coding agent. Stop shipping AI-slop UI: turn it into shippable, tasteful frontend. Install: npx skills add superdesigndev/superdesign-skill. Powered by superdesign.dev
+289 stars in 30 days +101% vs previous 30 days Score 58 - Rank 13
dembrandt/dembrandt-skillsOpen dembrandt/dembrandt-skills on GitHub (opens in new tab)
Senior-level UX and design-system knowledge, packaged so your AI agent applies it automatically.
+80 stars in 30 days +400% vs previous 30 days Score 57Also from dembrandt
dembrandt/dembrandtOpen dembrandt/dembrandt on GitHub (opens in new tab)
Extract any website’s design system into tokens in seconds: logo, colors, typography, borders & more. One command.
+267 stars in 30 days −54% vs previous 30 days Score 53 - Rank 14
alchaincyf/huashu-designOpen alchaincyf/huashu-design on GitHub (opens in new tab)
Huashu Design · HTML-native design skill for Claude Code · Claude Code 里 HTML 原生的设计 skill · 高保真原型 / 幻灯片 / 动画 + 20 设计哲学 + 5 维评审 + MP4 导出 · Agent-agnostic
+1.3k stars in 30 days +35% vs previous 30 days Score 50 - Rank 15
southleft/figma-console-mcpOpen southleft/figma-console-mcp on GitHub (opens in new tab)
Your design system as an API. Connect AI to Figma for extraction, creation, and debugging.
+240 stars in 30 days +59% vs previous 30 days Score 49 - Rank 16
isjiamu/gzh-design-skillOpen isjiamu/gzh-design-skill on GitHub (opens in new tab)
把 Markdown 一键排成可直接粘进公众号编辑器的精致 HTML —— 6 套精选主题 + 主题生成器 + 双关卡校验。An AI-agent skill that turns Markdown into paste-ready WeChat article HTML.
+301 stars in 30 days −43% vs previous 30 days Score 43 - Rank 17
nikolas-sapa/ns-uiOpen nikolas-sapa/ns-ui on GitHub (opens in new tab)
A shadcn-compatible registry of 542 React components you install as plain source — no package, no lock-in. Tailwind v4, Motion, and react-three-fiber. Ships with a CLI and an MCP server for agent-driven installs.
+17 stars in 30 days +467% vs previous 30 days Score 43 - Rank 18
Nutlope/hallmarkOpen Nutlope/hallmark on GitHub (opens in new tab)
Anti-AI-slop design skill for Claude Code, Cursor, and Codex.
+1.6k stars in 30 days −40% vs previous 30 days Score 41 - Rank 19
21st-dev/magic-mcpOpen 21st-dev/magic-mcp on GitHub (opens in new tab)
It's like v0, but in your Cursor / Claude Code / Windsurf: search 10,000+ React/Tailwind components, generate new UI with AI, and publish your own — right from your editor. Magic MCP is now the 21st MCP; this package keeps old configs working. Setup: 21st.dev/mcp
+256 stars in 30 days +24% vs previous 30 days Score 36 - Rank 20
Manavarya09/design-extractOpen Manavarya09/design-extract on GitHub (opens in new tab)
Extract any website's complete design system with one command. DTCG tokens, semantic+primitive+composite, MCP server for Claude Code/Cursor/Windsurf, multi-platform emitters (iOS SwiftUI, Android Compose, Flutter, WordPress), Tailwind v4, Figma variables, shadcn/ui, CSS health audit, WCAG remediation, Chrome extension. MIT, Playwright, Node 20+.
+170 stars in 30 days −78% vs previous 30 days Score 35 - Rank 21
oil-oil/beautify-github-readmeOpen oil-oil/beautify-github-readme on GitHub (opens in new tab)
README design skill for Claude Code & Codex. 帮你把 GitHub README 做得好看又好懂。
+131 stars in 30 days +2% vs previous 30 days Score 35 - Rank 22
udecode/plateOpen udecode/plate on GitHub (opens in new tab)
Rich-text editor with AI and shadcn/ui
+81 stars in 30 days −18% vs previous 30 days Score 34 - Rank 23
Dammyjay93/interface-designOpen Dammyjay93/interface-design on GitHub (opens in new tab)
Design engineering for Claude Code. Craft, memory, and enforcement for consistent UI.
+134 stars in 30 days −30% vs previous 30 days Score 21 - Rank 24
GLips/Figma-Context-MCPOpen GLips/Figma-Context-MCP on GitHub (opens in new tab)
MCP server to provide Figma layout information to AI coding agents like Cursor
+172 stars in 30 days −25% vs previous 30 days Score 20 - Rank 25
guanyang/open-agent-hubOpen guanyang/open-agent-hub on GitHub (opens in new tab)
A lightweight, zero-dependency CLI tool to manage and activate capabilities for AI coding assistants (such as Claude Code, Cursor, Trae, etc.).
+13 stars in 30 days −35% vs previous 30 days Score 17 - Rank 26
onlook-dev/onlookOpen onlook-dev/onlook on GitHub (opens in new tab)
The Developer Tool for Visual Engineers • An Open-Source AI-First Design tool • Visually build, style, and edit your code with AI • World's best, top-most agent recommended #1 Developer tool for Designers and Visual Engineers to design with Real Code.
+274 stars in 30 days −1% vs previous 30 days Score 16
Showing 10 of 26 ranked repos. 16 newcomers are listed separately. 1 repo is folded under its owner’s best-ranked project.