polish

Reviews frontend work for alignment, spacing, interaction states, and consistency issues before shipping.

1|Updated Oct 20, 2024
One-click install
npx skills add https://github.com/SteveChandler/quiver --skill polish-stevechandler
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: polish
Source: https://github.com/SteveChandler/quiver/tree/main/.agents/skills/polish
Command: npx skills add https://github.com/SteveChandler/quiver --skill polish-stevechandler

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve? Finished features often ship with small visual and interaction defects—misaligned elements, inconsistent spacing, missing hover or focus states, and unhandled edge cases—that degrade perceived quality. This Skill provides a systematic final review pass to catch those details before release. ## Core Features & Use Cases - Systematic Visual Review: Checks alignment, spacing tokens, typography hierarchy, color contrast, and theme consistency across breakpoints. - Interaction State Coverage: Verifies every interactive element has default, hover, focus, active, disabled, loading, error, and success states. - Edge Case & Code Hygiene Checks: Audits empty states, error messages, long content handling, accessibility, and removes console logs and dead code. - Use Case: Before merging a new dashboard page, run this Skill to verify responsive behavior, WCAG contrast ratios, 44px touch targets, and smooth 60fps transitions. ## Quick Start Ask the AI to run a final polish pass on the current feature, checking alignment, interaction states, and edge cases against the design system before shipping.

Frequently Asked Questions about polish

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

FAQPage Schema
How do I do a final UI quality check before shipping a feature?▼

Run a systematic polish pass covering alignment, spacing tokens, typography hierarchy, interaction states, and edge cases. Verify responsive behavior at all breakpoints, test keyboard navigation, and confirm contrast ratios meet WCAG standards before release.

What interaction states should every button or input have?▼

Every interactive element needs default, hover, focus, active, disabled, loading, error, and success states. Missing states create confusion; focus indicators must never be removed without a visible replacement for keyboard users.

When should I not run a polish pass on frontend work?▼

Do not polish work that is not functionally complete, since polish is the last step. Also triage based on timeline—if shipping imminently, prioritize critical issues over exhaustive refinement.

Does this polish checklist cover accessibility requirements?▼

Yes, it checks WCAG contrast ratios, visible focus indicators, keyboard navigation, ARIA labels, semantic HTML, 44x44px touch targets, and respect for the prefers-reduced-motion setting.

Why does my UI feel off even though everything works?▼

Common causes are inconsistent spacing not using design tokens, missing hover or loading states, hard-coded colors, and misaligned elements. A systematic review against a spacing scale and state checklist usually reveals the issues.