設計與介面
設計系統、Figma、前端與介面生成。
28 個項目 合計 277k 顆星
從這個開始
這個情境裡品質分數最高的項目。僅供起步參考，不代表背書。
Agent skills that give coding agents taste: art direction, reference images and a browser check instead of generic AI pages
npx skills add https://github.com/Leonxlnx/taste-skill --skill "design-taste-frontend"
The design vocabulary for your coding agent. Steer with polish and bolder, review with critique and audit, catch AI slop before it ships.
npx impeccable install
🥷 Engineering habits you already know, turned into skills AI assistants like Claude Code, Codex and Cursor can run.
npx skills add tw93/Waza -a claude-code codex cursor -g -y
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.
/plugin marketplace add nateherkai/scroll-craft
npm install -g pinme
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。
npx skills add oil-oil/oil-ui
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.
/plugin marketplace add plugin87/ux-ui-agent-skills
Universal motion design principles for AI agents — timing, easing, choreography, and Disney animation principles adapted for UI
npx skills add LottieFiles/motion-design-skill
Silex is an online tool for visually creating static sites with dynamic data. With the free/libre spirit of internet, together.
git clone --recurse-submodules https://github.com/silexlabs/Silex.git
npx skills add https://github.com/bergside/typeui --skill typeui-fundamentals
Turn reference UIs (images, screenshots, URLs) into quantified Design DNA JSON—tokens, qualitative style, visual effects—then generate matching UI from your content.
npx skills add zanwei/design-dnanpx skills add oil-oil/beautify-github-readme
A Claude Code skill that reverse-engineers any animation frame by frame, then proves the copy moves the same.
npx skills add NiazMorshed2007/reanimate -g
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.
npx skills add awdr74100/figwright/skills
npx skills add wheresryan22/anatomy -g # optional: interactive isometric explainer figures
open-source skill that learns any brand and turns it into a complete design system. works on claude code and codex. install once, every UI your assistant builds matches your brand.
git clone https://github.com/dominikmartn/hue ~/.claude/skills/hue
An agent skill that draws animated icons in one consistent style, for Claude Code, Codex and other coding agents. Comes with 2,600+ open-source icons for React, Vue and SVG, and a website to browse th
git clone https://github.com/kubai087/kubai-icons.git ~/.claude/skills/kubai-icons
A Claude Code SKILL for designing beautiful, consistent web pages — spec first, code second.
git clone https://github.com/KAOPU-XiaoPu/web-design ~/.claude/skills/web-design
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.
/plugin marketplace add edisonmbli/refactoring-ui-skill
git clone https://github.com/helloianneo/ian-xhs-carousel.git
Claude skill that analyzes images, websites, and Figma files and generates a structured design.md with token system, component inventory, and reconstruction notes.
git clone https://github.com/uxKero/anydesign.git
Design intelligence engine for AI coding tools (Claude Code, Cursor, Windsurf). Deterministic anti-AI-slop linter with 152 rules, 160 brand specs, a 7-axis synthesizer, an MCP server (18 tools), 25 co
pip install uxskill
Elite frontend design taste for Claude Code / Cowork — a merged synthesis of emilkowalski/skill, pbakaus/impeccable, and leonxlnx/taste-skill. Typography, color, motion, components, anti-slop.
npx skills add h3nryprod01/design-taste
全网首个中文字体专业知识包：可商用中文字体库（授权三级分类）、场景×气质选字矩阵、中英混排与排版规则。让 AI 选中文设计字体不再甩给你一堆 Inter / Chinese font selection agent skill: license-safe free commercial CJK fonts, scene-based selection matrix, CJK-Latin pairi
npx skills add <your-github-username>/chinese-font-selector
AI design system scanner + mcp server. Scores repos 0-100, writes fix prompts. 30K+ npm downloads.
npx roast-my-design-system@latest