i-polish

Inspect UI alignment, spacing, typography, and interaction states for final QA.

Updated Dec 30, 2025
One-click install
npx skills add https://github.com/senpapi69/ghost-hunter-dashboard --skill i-polish-senpapi69
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: i-polish
Source: https://github.com/senpapi69/ghost-hunter-dashboard/tree/main/.claude/skills/i-polish
Command: npx skills add https://github.com/senpapi69/ghost-hunter-dashboard --skill i-polish-senpapi69

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Polishes UI details to fix alignment, spacing, and consistency before shipping.

Core Features & Use Cases

  • Visual Alignment & Spacing: Pixel-perfect alignment, consistent spacing, optical centering, responsive consistency, grid adherence.
  • Typography Refinement: Hierarchy consistency, line length, line height, widows/orphans, kerning, font loading.
  • Color & Contrast: WCAG-compliant contrast, token usage, theme consistency, accessible focus.
  • Interaction States: Default, Hover, Focus, Active, Disabled, Loading, Error, Success.
  • Micro-interactions & Transitions: Smooth transitions, consistent easing, reduced motion respect.
  • Content & Copy: Terminology, capitalization, grammar, punctuation.
  • Icons & Images: Consistent style, proper alt text, retina assets.
  • Forms & Inputs: Proper labeling, error messages, validation timing.
  • Edge Cases & Error States: Loading, empty, error, success, offline handling.
  • Responsiveness: Breakpoints, touch targets, readable text.
  • Performance: Fast load, minimized CLS.
  • Code Quality: Clean up, accessibility.

Quick Start

Run a final polish pass on the current UI feature, verifying alignment, typography, and interactions across breakpoints.

Frequently Asked Questions about i-polish

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I run a final polish pass on my UI before shipping?

Run a final polish pass by checking visual alignment, spacing, typography, and interaction states across all breakpoints. This process applies comprehensive checks for pixel-perfect grid adherence, WCAG color contrast, and responsive consistency to ensure flawless UI details.

What is UI polish and what does it fix?

UI polish is the final QA step that fixes alignment, spacing, and consistency issues before shipping. It refines typography hierarchy, verifies interaction states, and checks edge cases like loading and error handling to ensure dashboards and component libraries are visually flawless.

How do I check UI accessibility and color contrast during a design QA?

Check UI accessibility by verifying WCAG-compliant color contrast, accessible focus states, and proper alt text for images. A design QA polish pass ensures token usage and theme consistency meet accessibility standards across all product interfaces and component states.

Does this UI polish process handle interaction states and micro-interactions?

Yes, the UI polish process handles interaction states by checking default, hover, focus, active, and disabled states. It also refines micro-interactions and transitions to ensure smooth easing and respects reduced motion preferences for accessibility.

Can I use this polish pass for responsive design and touch targets?

Yes, you can use this polish pass for responsive design by verifying breakpoints, touch targets, and readable text across screens. It ensures responsive consistency, grid adherence, and minimized layout shift for product interfaces and dashboards.

What is the best way to fix typography hierarchy and spacing consistency in a component library?

The best way to fix typography and spacing is running a comprehensive polish pass that checks hierarchy consistency, line length, line height, and kerning. It enforces consistent spacing and optical centering to ensure component library polish across all states.