polish

Audit UI alignment, typography, spacing, and interaction states across breakpoints.

45|3|Updated Jan 20, 2026
One-click install
npx skills add https://github.com/YuDefine/nuxt-supabase-starter --skill polish-yudefine
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: polish
Source: https://github.com/YuDefine/nuxt-supabase-starter/tree/main/.claude/skills/polish
Command: npx skills add https://github.com/YuDefine/nuxt-supabase-starter --skill polish-yudefine

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Polishing UI and UX before release to ensure visual consistency, accessibility, and a polished user experience by addressing alignment, spacing, typography, and motion details.

Core Features & Use Cases

  • Visual Alignment & Spacing: ensure pixel-perfect grid alignment and consistent gaps across breakpoints.
  • Typography & Copy Refinement: unify font scales, line heights, and copy consistency for clarity and polish.
  • Interaction States & Accessibility: verify focus outlines, hover/active states, keyboard navigation, and respect for reduced motion.
  • Use Case: apply this polish workflow to a new responsive dashboard before handoff to QA.

Quick Start

Polishing the latest UI component means auditing and adjusting alignment, typography, states, and copy to meet project design standards.

Frequently Asked Questions about polish

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

FAQPage Schema
What is a final polish pass for UI design before shipping?

A final polish pass for UI design ensures interfaces achieve pixel-perfect alignment, consistent typography, and cohesive spacing before shipping. It enforces a comprehensive checklist to audit visual alignment, interaction states, and copy quality.

How do I ensure pixel-perfect visual alignment and consistent spacing across multiple breakpoints?

To ensure pixel-perfect visual alignment and consistent spacing across multiple breakpoints, apply a polish workflow that audits grid alignment and gap consistency. This process prevents visual regressions and enforces cohesive spacing standards across responsive views.

Can I use this polish workflow to verify interaction states and accessibility on a responsive dashboard?

Yes, you can use this polish workflow to verify interaction states and accessibility on a responsive dashboard. It checks focus outlines, hover and active states, keyboard navigation, and ensures respect for reduced motion preferences.

Does UI polish include typography and copy refinement before handoff to QA?

Yes, UI polish includes typography and copy refinement before handoff to QA. The workflow unifies font scales, line heights, and copy consistency to ensure clarity and a polished user experience across all components.

What's the best way to guard against visual regressions during a final polish pass?

The best way to guard against visual regressions during a final polish pass is to enforce a comprehensive checklist. This checklist audits alignment, spacing, typography, and motion details to ensure final polish remains consistent before shipping.

When do I need to apply a comprehensive polish checklist to my UI components?

You need to apply a comprehensive polish checklist to your UI components before shipping or handing off to QA. This ensures visual consistency, accessibility, and a polished user experience by addressing alignment, spacing, typography, and motion details.