---
title: "Refactoring UI Design System - Air Market"
description: "Your web interface works but looks unprofessional and you cannot point at the reason. This audits and fixes the visual side: hierarchy, spacing, color and depth, working in grayscale first and keepin…"
canonical: "https://airmarket.ai/app/refactoring-ui"
---

[Air Market](/) / [Design](/category/design) / Refactoring UI Design System

Skill by [wondelai](/@wondelai)

# Refactoring UI Design System

For when your web UI just looks off and you can't say why

## What this does

Your web interface works but looks unprofessional and you cannot point at the reason. This audits and fixes the visual side: hierarchy, spacing, color and depth, working in grayscale first and keeping to a limited set of choices. Reach for it before a launch, or when a design needs to look considered.

### Top 3 things it does for you

- Fix a design that looks amateur
- Build a consistent spacing and color scale
- Sort out visual hierarchy on a busy screen

## Information

**Refactoring UI Design System at a glance**

|  |  |
| --- | --- |
| Kind | Skill |
| Publisher | [wondelai](/@wondelai) |
| Category | [Design](/category/design) |
| Works with | Agent Skills - an open standard supported by 40+ agents |
| Version | 1.5.0 |
| Size | 68 KB |
| Licence | MIT |
| Repository | [wondelai/skills](https://github.com/wondelai/skills/tree/326b3801223ad277ae7082ff85435ba1d36e1903/refactoring-ui) |
| GitHub stars | 2,004 (as of Nov 2026) |
| Installs | 10,181, counted by skills.sh (Nov 2026) |

## Security report

**Verified.** AIR scanned this exact version of Refactoring UI Design System and recorded 0 findings and 2 flagged items. AIR's verdict: **safe**.

**What Refactoring UI Design System's check was run against**

|  |  |
| --- | --- |
| Commit | 326b3801223ad277ae7082ff85435ba1d36e1903 |
| Content hash | 28a7bfea52498d3a34e334bf78488221e956d025beba20f23eba3cc781ed25da |
| Files read | [Browse the files at this exact commit](https://github.com/wondelai/skills/blob/326b3801223ad277ae7082ff85435ba1d36e1903/refactoring-ui/SKILL.md) |

A scan is named by the exact content it read, not by a version number. A different version is a different artifact, and nothing here applies to a version AIR has not scanned.

[Read the full security report for Refactoring UI Design System](/security/refactoring-ui)

## About Refactoring UI Design System

This skill audits and fixes visual hierarchy, spacing, color, and depth in web UIs.

It covers a grayscale-first workflow, constrained design scales, shadows, and component styling. Use it when a UI looks off, amateur or unprofessional, when building consistent design tokens, creating dark mode themes, improving data-visualization clarity, or polishing details before launch. Color palettes, spacing scales, design systems and Tailwind styling all fall inside it.

For typeface selection see web-typography; for usability audits see ux-heuristics.

## What's inside

- SKILL.md - instructions
- references/accessibility-depth.md - reference
- references/advanced-patterns.md - reference
- references/animation-microinteractions.md - reference
- references/data-visualization.md - reference
- references/theming-dark-mode.md - reference

## Questions

### Is Refactoring UI Design System safe to install?

AIR scanned this exact version of Refactoring UI Design System and recorded 0 findings and 2 flagged items. AIR's verdict: safe. The verdict is named by the content that was read, at commit 326b3801223a, so it cannot drift onto a version nobody scanned. The full report is at https://airmarket.ai/security/refactoring-ui.

### How do I install Refactoring UI Design System?

Open https://airmarket.ai/app/refactoring-ui on Air Market and use the install action: Air Market hands Claude a prompt naming this exact skill, and Claude sets it up. Source, pinned to the exact commit this listing describes: https://github.com/wondelai/skills/tree/326b3801223ad277ae7082ff85435ba1d36e1903/refactoring-ui. Install from that link, not the branch.

## Related on Air Market

- [More Design listings](/category/design)
- [Everything by wondelai](/@wondelai)

---

Canonical URL: <https://airmarket.ai/app/refactoring-ui>