← All skills
ui-styling
80 / 100 · Low risk
Fine to try.
By nextlevelbuilder/ui-ux-pro-max-skill (GitHub) · design · 148,019 stars · scanned at commit 6ae86f6
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 user interfaces, implementing design systems, creating responsive layouts, adding accessible components (dialogs, dropdowns, forms, tables), customizing themes and colors, implementing dark mode, generating visual designs and posters, or establishing consistent styling patterns across applications.
Works with any agent that supports SKILL.md skills.
What this skill can do
Downloads and installs other software
The author does not mention this.
Found in 11 places.
Show 8 more
- .claude/skills/ui-styling/references/shadcn-components.md, line 10
npx shadcn@latest add button card dialog # Multiple - .claude/skills/ui-styling/references/shadcn-components.md, line 11
npx shadcn@latest add --all # All components - .claude/skills/ui-styling/scripts/shadcn_add.py, line 100
"shadcn not initialized. Run 'npx shadcn@latest init' first", - .claude/skills/ui-styling/scripts/shadcn_add.py, line 146
return False, "npx not found. Ensure Node.js is installed" - .claude/skills/ui-styling/scripts/shadcn_add.py, line 161
"shadcn not initialized. Run 'npx shadcn@latest init' first", - .claude/skills/ui-styling/scripts/shadcn_add.py, line 194
return False, "npx not found. Ensure Node.js is installed" - .claude/skills/ui-styling/scripts/tests/test_shadcn_add.py, line 195
"""Test component addition when npx is not found.""" - .claude/skills/ui-styling/scripts/tests/test_shadcn_add.py, line 202
assert "npx not found" in message
Runs commands on your computer
The author does not mention this.
Found in 21 places.
Show 17 more
- .claude/skills/ui-styling/SKILL.md, line 222
python scripts/shadcn_add.py button card dialog - .claude/skills/ui-styling/SKILL.md, line 228
python scripts/tailwind_config_gen.py --colors brand:blue --fonts display:Inter - .claude/skills/ui-styling/SKILL.md, line 236
python scripts/tailwind_config_gen.py --colors brand:blue --force - .claude/skills/ui-styling/scripts/shadcn_add.py, line 126
result = subprocess.run( - .claude/skills/ui-styling/scripts/shadcn_add.py, line 142
except subprocess.CalledProcessError as e: - .claude/skills/ui-styling/scripts/shadcn_add.py, line 174
result = subprocess.run( - .claude/skills/ui-styling/scripts/shadcn_add.py, line 190
except subprocess.CalledProcessError as e: - .claude/skills/ui-styling/scripts/tests/test_shadcn_add.py, line 130
with patch("subprocess.run") as mock_run: - .claude/skills/ui-styling/scripts/tests/test_shadcn_add.py, line 156
@patch("subprocess.run") - .claude/skills/ui-styling/scripts/tests/test_shadcn_add.py, line 180
@patch("subprocess.run") - .claude/skills/ui-styling/scripts/tests/test_shadcn_add.py, line 183
mock_run.side_effect = subprocess.CalledProcessError( - .claude/skills/ui-styling/scripts/tests/test_shadcn_add.py, line 193
@patch("subprocess.run") - .claude/skills/ui-styling/scripts/tests/test_shadcn_add.py, line 221
@patch("subprocess.run") - .claude/skills/ui-styling/scripts/tests/test_tailwind_config_gen.py, line 315
result = subprocess.run( - .claude/skills/ui-styling/scripts/tests/test_tailwind_config_gen.py, line 335
result = subprocess.run( - .claude/skills/ui-styling/scripts/tests/test_tailwind_config_gen.py, line 356
result = subprocess.run( - .claude/skills/ui-styling/scripts/tests/test_tailwind_config_gen.py, line 379
result = subprocess.run(
and 1 more places
Other copies in this repository
nextlevelbuilder/ui-ux-pro-max-skill has 1 more folder with a skill named ui-styling. This page shows the lowest-scoring copy.
Install
Paste this into your terminal. It downloads exactly the version we scanned, not whatever is newest.
if [ -e ~/.agents/skills/'ui-styling' ] || [ -L ~/.agents/skills/'ui-styling' ]; then echo 'A skill folder named ui-styling already exists — not replacing it' >&2; false; else d=$(mktemp -d) && git clone --quiet --filter=blob:none --no-checkout 'https://github.com/nextlevelbuilder/ui-ux-pro-max-skill' "$d" && git -C "$d" checkout --quiet '6ae86f61f520d6ca229d2f40e070410638c908c5' -- '.claude/skills/ui-styling' && mkdir -p ~/.agents/skills && cp -R "$d"/'.claude/skills/ui-styling' ~/.agents/skills/'ui-styling' && rm -rf "$d"; fi
Codex reads ~/.agents/skills directly. For Claude Code, Cursor, Copilot, Gemini CLI, Antigravity or OpenCode, also link it. For Claude Code: ln -s ~/.agents/skills/'ui-styling' ~/.claude/skills/'ui-styling' (other agents: ~/.cursor/skills, ~/.copilot/skills, ~/.gemini/skills, ~/.gemini/config/skills, ~/.config/opencode/skills). Or install through the finder skill, which does both.
Badge for your README
The badge for nextlevelbuilder/ui-ux-pro-max-skill shows the score of its lowest-scoring skill.
[](https://zalavijaysinh.github.io/skilltrust/repos/nextlevelbuilder/ui-ux-pro-max-skill/)
Score history
| Date | Version | Score |
|---|
| 2026-11-11 | 6ae86f6 | 80 |
| 2026-11-08 | 4f2dbb6 | 80 |
| 2026-11-07 | 0da327f | 80 |