nicohodt/claude-code-ui-ux-skill

README preview

# Claude Code UI/UX Skill — AI Design Intelligence for Claude, Cursor & Windsurf

**The open-source Claude skill that makes AI-generated UI and UX actually good.** Instead of hoping the model guesses a decent design, this skill gives it a searchable design-intelligence database — **84 UI styles, 192 color palettes, 74 font pairings, 99 UX guidelines, 161 industry reasoning rules, and 25 chart types across 22 tech stacks** — and a generator that turns any product brief into a complete, concrete design system.

Built for **[Claude Code](https://claude.com/product/claude-code)**. Works with Cursor, Windsurf, GitHub Copilot, Codex, Gemini CLI, and 14 more AI coding assistants.

<p align="center">
  <a href="https://github.com/nicohodt/claude-code-ui-ux-skill/blob/main/README.md">🇺🇸 English</a> |
  <a href="https://github.com/nicohodt/claude-code-ui-ux-skill/blob/main/README.zh.md">🇨🇳 简体中文</a>
</p>

<p align="center">
  <a href="https://github.com/nicohodt/claude-code-ui-ux-skill/releases"><img src="https://img.shields.io/github/v/release/nicohodt/claude-code-ui-ux-skill?style=for-the-badge&color=blue" alt="Latest release of the Claude Code UI/UX skill"></a>
  <img src="https://img.shields.io/badge/reasoning_rules-161-green?style=for-the-badge" alt="161 industry design reasoning rules">
  <img src="https://img.shields.io/badge/UI_styles-84-purple?style=for-the-badge" alt="84 UI design styles">
  <a href="https://github.com/nicohodt/claude-code-ui-ux-skill/blob/main/LICENSE"><img src="https://img.shields.io/github/license/nicohodt/claude-code-ui-ux-skill?style=for-the-badge&color=green" alt="MIT licensed"></a>
</p>

<p align="center">
  <a href="https://github.com/nicohodt/claude-code-ui-ux-skill/actions/workflows/tests.yml"><img src="https://img.shields.io/github/actions/workflow/status/nicohodt/claude-code-ui-ux-skill/tests.yml?branch=main&style=flat-square&label=tests" alt="Test suite status"></a>

View full repository on GitHub →