nyldn

Refactor UI — Design skill for Claude Code

Design community

Apply tactical UI improvements using Refactoring UI principles.

How to install Refactor UI

Installs to ~/.claude/skills/nyldn-claude-dolphin-refactor-ui/SKILL.md

Terminal

mkdir -p ~/.claude/skills/nyldn-claude-dolphin-refactor-ui && curl -fsSL https://raw.githubusercontent.com/nyldn/claude-dolphin/HEAD/commands/refactor-ui.md -o ~/.claude/skills/nyldn-claude-dolphin-refactor-ui/SKILL.md

Restart Claude Code, or start a new session, for it to be picked up.

What Refactor UI does

description: Apply tactical UI improvements using Refactoring UI principles argument-hint: "[component-path]" allowed-tools: Read, Edit, Write

Refactor UI Command

Apply tactical UI improvements to the specified component using Refactoring UI principles.

**Required:** Specify a component file path.

Refactoring Process

Step 1: Current State Analysis

Read the target component and document:

**Visual Structure:**

Current spacing values
Typography (sizes, weights, colors)

Alternatives in Design

Brand Guidelines — Apply Anthropic's official brand colors and typography to artifacts 94.1k ★
Brainwave — Learn to create modern websites with sleek parallax effects and bento box layouts 1.9k ★
Design Expert — Apply expert UX/UI design thinking to design, redesign, enhance, or fix any interface element with meticulous 348 ★