| name | ui-polish |
| description | Improve visual quality, spacing, hierarchy, typography, color, motion, icons, empty states, and perceived product quality for desktop and web UI. Use when the user asks for UI beautification, visual polish, making an interface look professional, modernizing screens, or improving design quality without changing core functionality. |
UI Polish
Workflow
- Identify the product type, target user, and current visual language.
- Improve hierarchy first: spacing, alignment, grouping, density, and scan paths.
- Refine typography, color, contrast, radius, borders, shadows, and icon usage.
- Polish states: hover, active, focus, loading, empty, error, disabled, and success.
- Check desktop and mobile layouts, text fit, and visual balance.
Quality Bar
- Make UI feel intentional, not decorative.
- Use restrained accents and avoid one-note palettes.
- Prefer consistent spacing scales and clear component rhythm.
- Use icons for recognizable actions, with labels or tooltips where needed.
- Keep operational tools dense and calm; avoid marketing-style hero sections inside apps.
- Do not hide weak information architecture behind gradients or decoration.
Output
State the visual direction, concrete UI changes, files touched, and viewport verification. Include before/after risks when changing density or hierarchy.
