frontend-polish

Refines existing frontend interfaces by fixing spacing, typography, color, and responsive behavior.

60|11|Updated Jun 15, 2026
One-click install
npx skills add https://github.com/matyasstoch/david-skills --skill frontend-polish-matyasstoch
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: frontend-polish
Source: https://github.com/matyasstoch/david-skills/tree/main/skills/frontend-polish
Command: npx skills add https://github.com/matyasstoch/david-skills --skill frontend-polish-matyasstoch

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve? Existing interfaces often feel inconsistent or unfinished due to unclear hierarchy, uneven spacing, weak typography, and fragile mobile layouts. This Skill systematically improves visual quality and cohesion without changing the product direction or rewriting working code. ## Core Features & Use Cases - Visual Hierarchy Fixes: Strengthens hierarchy through spacing, sizing, alignment, and contrast adjustments rather than adding new components. - Design System Consistency: Standardizes repeated patterns such as card padding, border radii, button styles, and text sizes across pages. - State and Responsive Polish: Improves loading, empty, and error states plus mobile wrapping, overflow, and grid behavior. - Use Case: You have a working dashboard that feels cluttered and inconsistent. Use this Skill to tighten spacing, unify card styles, fix button hierarchy, and verify desktop and mobile behavior while preserving all existing flows. ## Quick Start Use frontend-polish to refine this page's spacing, typography, and card consistency without changing the product direction.

Frequently Asked Questions about frontend-polish

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

FAQPage Schema
How do I polish an existing UI without redesigning it?▼

Start by inspecting the current interface, then identify the highest-leverage problems such as unclear hierarchy, inconsistent spacing, or weak typography. Apply small scoped CSS and component edits that extend the existing visual language rather than restyling it.

How to make UI spacing and typography more consistent?▼

Standardize repeated patterns like card padding, border radii, gaps, and text sizes so similar elements actually match. If no design system exists, define a few consistent tokens or repeated rules and apply them across components.

Does frontend polish work with an existing design system?▼

Yes, the workflow explicitly follows the existing design system when one is present. It extends current patterns and tokens instead of introducing new dependencies, accent colors, or unrelated component styles.

Can UI polish changes break mobile responsive layouts?▼

They can if desktop and mobile behavior are not verified after editing. The workflow includes checking mobile wrapping, overflow, and uneven grid behavior, plus keeping touch targets and focus states accessible.

When should you not use a UI polish approach?▼

Avoid it when the product needs a full redesign or new direction, since polish preserves the current direction by design. It is also unsuitable for adding trendy effects or decorative complexity that fights clarity.