Applies a final craft pass to UI code, focusing on spacing, typography, and signature motifs to finish a design.

Install

mkdir -p .claude/skills/polish-educlopez && curl -L -o skill.zip "https://agentskills.codes/api/skills/download/18255" && unzip -o skill.zip -d .claude/skills/polish-educlopez && rm skill.zip

Installs to .claude/skills/polish-educlopez

Activation

This is the description your AI agent reads to decide when to run this skill — the better it matches your request, the more reliably it fires.

Final craft pass applying the compound details from the polish checklist — micro-typography, spacing rhythm, hover states, and a signature detail — directly to code. Use when the surface is functionally complete but feels unfinished, or when the user says "polish this" / "it looks generic" / "add the final touches". Invoke when the user asks for polish on their UI, or mentions 'polish' alongside design / UI / frontend work.
427 chars✓ has a “when” triggerlonger than Claude Code's old 250-char listing cap (fine on current versions)
Intermediate

Key capabilities

  • Apply micro-typography adjustments
  • Adjust spacing rhythm in UI
  • Implement hover states
  • Add a signature detail to UI
  • Verify existing signature details
  • Edit code directly for UI refinements

How it works

This skill applies UI refinements by following a polish checklist from `references/review.md` and adding a signature detail. It directly edits the code to implement these changes.

Inputs & outputs

You give it
Functionally complete UI code
You get back
Refined UI code with applied polish details

When to use polish

  • Polish UI
  • Final design touches
  • Make interface look finished

About this skill

<!-- HARNESS MIRROR — do not edit here. Canonical source: skills/ or commands/. After editing source, copy into cli/assets/<harness>/ and repo-root harness mirrors. -->

Context: this sub-skill is one lens of the broader ui-craft skill. If the ui-craft skill is also installed, read its SKILL.md first for Discovery + Anti-Slop + Craft Test, then apply the specific lens below.

Polish the UI at $ARGUMENTS. Load the ui-craft skill.

Source of truth: read references/review.mdPolish Pass (Compound Details) section. Apply every item on that list to the target. Do not re-derive the list here — review.md owns it.

Then the signature detail: surfaces built via /craft already carry exactly one signature bet, chosen in the Craft Read and built in the first pass (references/craft-intent.md). Polish verifies it survived and strengthens it — never stacks a second. Only if the surface predates craft-intent (no signature anywhere) do you propose and add one: a subtle motif, an asymmetric layout break, a custom list marker, a distinctive hover — one thing someone would remember.

Knob gating (CRAFT_LEVEL):

  • ≤ 4 → skip the Polish Pass. Ask the user first before running it.
  • 5-7 → apply everything on the list, leave the signature as-built unless asked.
  • 8+ → apply everything + verify/strengthen the signature detail (add one only if the surface has none).

Output: edit the code directly (polish is implementation, not critique). After each file, print the Review Format table from SKILL.md showing what changed and why. No full diffs — one row per change.

Close every run with a Craft Report (references/review.md → Craft Report). The table above is the per-file diff log; the Craft Report is the run's receipt — Checked / Passed / Changed / Left alone / Verdict. Produce it even when the Polish Pass found nothing to change — that is itself the finding.

Next step: /finalize — the pre-ship gate (rung 3).

When not to use it

  • When the UI is not functionally complete
  • When the user has not requested UI polish or final touches
  • When `CRAFT_LEVEL` is less than 4

Limitations

  • Requires `ui-craft` skill for broader context
  • Does not re-derive the polish checklist
  • Only adds a signature detail if one does not already exist

How it compares

This skill systematically applies a predefined checklist of compound details and a signature element directly to code, providing a structured approach to UI finishing that goes beyond general design feedback.

Compared to similar skills

polish side by side with the closest alternatives in the catalog.

SkillInstallsUpdatedSafetyDifficulty
polish (this skill)022dNo flagsIntermediate
design-review04moReviewIntermediate
ui-styling128moReviewBeginner
tailwind-design-system342moNo flagsIntermediate

Try saying

Example prompts that trigger this skill in your AI assistant.

More by educlopez

View all by educlopez

brief

educlopez

Write or update the project's durable design brief at .ui-craft/brief.md. Invoke when the user asks for brief on their UI, or mentions 'brief' alongside design / UI / frontend work.

00

audit

educlopez

Technical UI audit — a11y, performance, responsive. Produces a prioritized findings table. Invoke when the user asks for audit on their UI, or mentions 'audit' alongside design / UI / frontend work.

00

distill

educlopez

Reduction pass — cuts content, structure, visuals, and dead code that doesn't answer a user question or drive an action, respecting CRAFT_LEVEL. Use when the UI feels cluttered, has too many CTAs, walls of text, or decorative noise, or when the user says "simplify this" / "it feels too busy". Invoke

00

ui-craft-dense-dashboard

educlopez

Dense dashboard / admin / Bloomberg / Retool / data-heavy internal tools. Locked knobs: CRAFT=7, MOTION=3, DENSITY=9. IBM Plex + mono numbers, semantic palette, 4/8px grid, sparklines, tabular-nums. Trigger on: dashboard, admin panel, data-dense, analytics, Bloomberg-like, Retool-like.

00

critique

educlopez

Design lens critique covering visual hierarchy, clarity, and anti-slop patterns — produces a findings table, no code edits unless asked. Use when the user wants a design review, says "what's wrong with this UI", or needs a second opinion before a handoff or presentation. Invoke when the user asks fo

00

adapt

educlopez

Responsive layout pass covering breakpoints, touch targets, safe areas, and fluid type. Use when the UI has layout or touch issues on mobile/tablet, when adding a new screen that hasn't been tested across viewports, or when the user says "make it responsive" / "fix mobile layout". Invoke when the us

00

You might also like

design-review

jerrywu001

|

00

ui-styling

mrgoonie

Create beautiful, accessible user interfaces with shadcn/ui components (built on Radix UI + Tailwind), Tailwind CSS utility-first styling, and canvas-based visual designs. Use when building user interfaces, implementing design systems, creating responsive layouts, adding accessible components (dialogs, dropdowns, forms, tables), customizing themes and colors, implementing dark mode, generating visual designs and posters, or establishing consistent styling patterns across applications.

12132

tailwind-design-system

wshobson

Build scalable design systems with Tailwind CSS, design tokens, component libraries, and responsive patterns. Use when creating component libraries, implementing design systems, or standardizing UI patterns.

3495

figma

openai

Use the Figma MCP server to fetch design context, screenshots, variables, and assets from Figma, and to translate Figma nodes into production code. Trigger when a task involves Figma URLs, node IDs, design-to-code implementation, or Figma MCP setup and troubleshooting.

2266

design-system-patterns

wshobson

Build scalable design systems with design tokens, theming infrastructure, and component architecture patterns. Use when creating design tokens, implementing theme switching, building component libraries, or establishing design system foundations.

1157

interaction-design

wshobson

Design and implement microinteractions, motion design, transitions, and user feedback patterns. Use when adding polish to UI interactions, implementing loading states, or creating delightful user experiences.

1550

Search skills

Search the agent skills registry