Agent skill

Refactor UI

by gnurio in gnurio/refactoring-ui-plugin

Analyze a design against all 10 Refactoring UI skills and generate a comprehensive assessment with specific fixes

Custom licenceAuto-check passedDevelopment

Install Refactor UI

skills CLI
$ npx skills add gnurio/refactoring-ui-plugin --skill refactor-ui -a claude-code

Project install by default; add -g for ~/.claude/skills/.

GitHub CLI
$ gh skill install gnurio/refactoring-ui-plugin refactor-ui --agent claude-code

Project scope by default; add --scope user for a personal install. Needs GitHub CLI 2.90.0 or later (public preview).

Manual copy
$ git clone --depth 1 https://github.com/gnurio/refactoring-ui-plugin.git skills-src && mkdir -p .claude/skills && cp -r skills-src/skills/meta-refactor-ui .claude/skills/refactor-ui && rm -rf skills-src

Use ~/.claude/skills/ instead of .claude/skills for a personal install. The folder must contain SKILL.md.

Claude Code skills documentation · loads skills from .claude/skills/

Facts

Skill name
refactor-ui
GitHub stars
443
Token cost
~955 tokens
SKILL.md length
158 words
Files
1
Skills in repo
11
Repo updated
First seen
Licence
Custom licence

At a glance

Analyze a design against all 10 Refactoring UI skills and generate a comprehensive assessment with specific fixes

  • Works in 4 steps: Load Skill Registry → Sequential Skill Application → Consolidate Findings → …
  • Tasks that involve Refactoring
  • SKILL.md covers Purpose, Workflow, Execution Modes and Usage Examples, plus 2 more sections
  • Instructions only: no scripts, shell commands, URLs or credentials in SKILL.md

What it does

Refactor UI is an agent skill from gnurio/refactoring-ui-plugin. Analyze a design against all 10 Refactoring UI skills and generate a comprehensive assessment with specific fixes

Its SKILL.md is about 960 tokens, which your agent loads only when the skill is triggered. It is a single SKILL.md file with no bundled scripts.

It sits in Development, covering Refactoring. The repository describes itself as: 10 applied skills for Claude Code and Cursor that turn the principles of Refactoring UI into structured AI-assisted design reviews | not affiliated, big fan, get their book here:.

When your agent uses it

  • Tasks that involve Refactoring

Example prompts

  • “/refactor-ui”

Workflow steps

4 steps, taken from the step headings in SKILL.md.

  1. Load Skill Registry
  2. Sequential Skill Application
  3. Consolidate Findings
  4. Generate Report

What it can do on your machine

Read from SKILL.md and the folder at commit 00781ea. It shows what the files ask for, not the result of running them.

  • Tool permissions

    Pre-approves nothing: there is no allowed-tools line, so your agent's usual permission prompts apply.

    From allowed-tools in the SKILL.md frontmatter.

  • Runs code

    No scripts in the folder and no shell commands in SKILL.md (its code samples are json).

    From the folder's file list and the shell code blocks in SKILL.md.

  • Network

    No URLs in SKILL.md.

    From URLs in SKILL.md, links to its own repository left out.

  • Credentials

    Names no API keys, tokens, secrets or passwords.

    From names ending in _API_KEY, _TOKEN, _SECRET, _KEY or _PASSWORD in SKILL.md.

Context cost

Refactor UI loads about 955 tokens when it runs. Until then it costs about 31 tokens; SKILL.md has 158 words of instructions outside code blocks.

Always · name and description, kept in context so the agent knows when to use it
~31
When it runs · the whole SKILL.md, loaded when a task matches
~955

Estimates: characters ÷ 4, the usual rule of thumb; real counts depend on the model's tokenizer. Scripts and assets cost tokens only if the agent reads them.

Safety

Auto-check passed

The automated check found no risky patterns in SKILL.md.

Automated static check — not a guarantee. Review scripts before installing. It scans the text of SKILL.md for risky patterns (piping downloads into a shell, reading credential files, hidden Unicode, destructive commands); files beside SKILL.md are not scanned.

SKILL.md

Its licence (Custom licence) doesn't allow us to republish the file, so here is its outline and opening line. It has 158 words (~955 tokens).

“Run a complete UI design audit against all 10 Refactoring UI principles, generating a prioritized list of specific improvements.”

— opening of SKILL.md by gnurio, Custom licence
name
refactor-ui
domain
ui-design
skill-type
orchestration
version
1.0.0
dependencies
01-establish-visual-hierarchy, 02-apply-typography-scale, 03-build-color-palette, 04-apply-consistent-spacing, 05-design-button-hierarchy…

Read the full SKILL.md on GitHub

Files

Just SKILL.md in skills/meta-refactor-ui of gnurio/refactoring-ui-plugin.

Open the folder on GitHubat commit 00781ea

Compare with similar skills

Refactor UI next to the 5 skills that share the most tags, products or categories with it. Stars are the repository's; “used in” counts other GitHub owners with a copy.

Refactor UI compared with similar skills
SkillStarsUsed inTokensAuto-checkLicenceRepo updated
Refactor UI this skillgnurio/refactoring-ui-plugin443—~955Automated safety check: PassCustom licence
Guidelinesakash-network/node1.1k22 repos~577Automated safety check: PassMIT
Component Refactoringlangflow-ai/langflow156k—~3.5kAutomated safety check: PassMIT
Migrate Core Code to Submodulestinyhumansai/openhuman42k—~2.6kAutomated safety check: PassGPL-3.0
Systematic Code Refactoringluongnv89/claude-howto42k—~3kAutomated safety check: PassMIT
Codexskills-directory/skill-codex1.5k3 repos~1.8kAutomated safety check: PassMIT

Similar skills

  • Guidelines

    akash-network/node

    Behavioral guidelines to reduce common LLM coding mistakes. An agent skill from akash-network/node.

    1.1k GitHub starsUsed in 22 repos~577 tokens
    DevelopmentAuto-check passed
  • Component Refactoring

    langflow-ai/langflow

    Refactor high-complexity React components in Langflow frontend.

    156k GitHub stars~3.5k tokensUpdated today
    DevelopmentAuto-check passed
  • Migrate Core Code to Submodules

    tinyhumansai/openhuman

    Plans and carries out moving non-host-specific code and its tests from the OpenHuman core into vendored tiny submodule libraries, then releases the submodule and re-pins the host.

    42k GitHub stars~2.6k tokensUpdated today
    DevelopmentAuto-check passed
  • Systematic Code Refactoring

    luongnv89/claude-howto

    Guides refactoring in phases based on Martin Fowler's method: research, test coverage check, planning and small tested steps, with your approval at each phase.

    42k GitHub stars~3k tokensUpdated 8 days ago
    DevelopmentAuto-check passed
  • Codex

    skills-directory/skill-codex

    A skill your agent uses when the user asks to run Codex CLI (codex exec, codex resume) or references OpenAI Codex for code analysis, refactoring, or automated editing

    1.5k GitHub starsUsed in 3 repos~1.8k tokens
    DevelopmentAuto-check passed
  • Ponytail

    DavidObando/gsharp

    Forces the laziest solution that actually works, simplest, shortest, most minimal.

    565 GitHub starsUsed in 8 repos~1.7k tokens
    DevelopmentAuto-check passed

More from gnurio/refactoring-ui-plugin

All 11 skills in this repo
  • Apply Consistent Spacing

    gnurio/refactoring-ui-plugin

    Use systematic spacing with 25% minimum jumps, start with excess whitespace

    443 GitHub stars~1.6k tokensUpdated 5 mo ago
    Auto-check passed
  • Apply Typography Scale

    gnurio/refactoring-ui-plugin

    Create clear typographic hierarchy using hand-crafted font sizes, weights, and colors

    443 GitHub stars~743 tokensUpdated 5 mo ago
    Auto-check passed
  • Build Color Palette

    gnurio/refactoring-ui-plugin

    Create comprehensive palette with 8-10 greys, 5-10 primary, 5-10 accent shades

    443 GitHub stars~1.6k tokensUpdated 5 mo ago
    Auto-check passed
  • Design Button Hierarchy

    gnurio/refactoring-ui-plugin

    Create clear primary/secondary/tertiary action distinctions. An agent skill from gnurio/refactoring-ui-plugin.

    443 GitHub stars~993 tokensUpdated 5 mo ago
    Auto-check passed
  • Design Empty States

    gnurio/refactoring-ui-plugin

    Create helpful, actionable zero-content states. An agent skill from gnurio/refactoring-ui-plugin.

    443 GitHub stars~982 tokensUpdated 5 mo ago
    Auto-check passed
  • Eliminate Visual Clutter

    gnurio/refactoring-ui-plugin

    Remove unnecessary borders, backgrounds, shadows, decorations

    443 GitHub stars~1k tokensUpdated 5 mo ago
    Auto-check passed

Categories

Questions about Refactor UI

What does Refactor UI do?

Analyze a design against all 10 Refactoring UI skills and generate a comprehensive assessment with specific fixes. Refactor UI is an agent skill from gnurio/refactoring-ui-plugin.

When should I use Refactor UI?

Refactor UI fits situations like: tasks that involve Refactoring.

How do I install Refactor UI in Claude Code?

Run `npx skills add gnurio/refactoring-ui-plugin --skill refactor-ui -a claude-code`. Or copy the skill folder (skills/meta-refactor-ui in gnurio/refactoring-ui-plugin) into .claude/skills/refactor-ui in your project. Claude Code loads it when a task matches its description.

How do I install Refactor UI in Codex?

Run `npx skills add gnurio/refactoring-ui-plugin --skill refactor-ui -a codex`. Or copy the skill folder (skills/meta-refactor-ui in gnurio/refactoring-ui-plugin) into .agents/skills/refactor-ui in your project. Codex loads it when a task matches its description.

Can I use Refactor UI in Cursor, Gemini CLI or GitHub Copilot?

Cursor, Gemini CLI, GitHub Copilot and OpenCode also load SKILL.md folders. With the skills CLI, run `npx skills add gnurio/refactoring-ui-plugin --skill refactor-ui -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/refactor-ui, .gemini/skills/refactor-ui, .github/skills/refactor-ui and .opencode/skills/refactor-ui in your project.

What does Refactor UI need to run?

SKILL.md names no scripts, command-line tools or credentials: Refactor UI is instructions for the agent only.

Does Refactor UI access the network?

SKILL.md contains no URLs. Any network use would come from the scripts or tools the agent runs. This is read from the text; nothing was executed.

Is Refactor UI safe to install?

Our automated static check of SKILL.md found no risky patterns, such as piping downloads into a shell, reading credential files or hidden Unicode. It is not a guarantee. Review the folder before installing.

What licence does Refactor UI use?

Refactor UI has a licence file (the repository's licence) that doesn't match a standard licence. Read it on GitHub before reusing the skill.

How many tokens does Refactor UI use?

About 955 tokens (SKILL.md is roughly 3.8k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full.

What are the alternatives to Refactor UI?

Skills that share tags, products or a category with Refactor UI: Guidelines (akash-network/node, 1.1k stars), Component Refactoring (langflow-ai/langflow, 156k stars), Migrate Core Code to Submodules (tinyhumansai/openhuman, 42k stars) and Systematic Code Refactoring (luongnv89/claude-howto, 42k stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.

Who maintains Refactor UI?

gnurio (a GitHub user) maintains it in gnurio/refactoring-ui-plugin, which has 443 GitHub stars. The repository holds 11 skills in this directory. The repository was last updated on April 26, 2026.

Source: gnurio/refactoring-ui-plugin on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.