skills.rest
Lortunate
LortunateCOMMUNITY
Explore all skills by this author →
GitHub

polish

Align UI visuals, typography, and interactions to design system guidelines.

1|Updated Apr 12, 2026
Search Tags:#typography#accessibility#design-system#polish#color-contrast#interaction-states#visual-alignment
One-click install
npx skills add https://github.com/Lortunate/CodexLAG --skill polish-lortunate
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: polish
Source: https://github.com/Lortunate/CodexLAG/tree/main/.claude/skills/polish
Command: npx skills add https://github.com/Lortunate/CodexLAG --skill polish-lortunate

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Polishing UI is labor-intensive and error-prone; this skill ensures final visual and interaction quality before shipping.

Core Features & Use Cases

  • Align visuals to the design system, fix spacing and typography, and ensure consistent interaction states across components.
  • Identify drift from design guidelines and resolve issues related to color contrast, typography hierarchy, and responsive behavior.
  • Use during pre-launch reviews or after iterations to elevate a product from MVP to flagship polish.

Quick Start

Run a final polish pass on the current UI to align visuals with the design system and fix micro-details.

Frequently Asked Questions about polish

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

FAQPage Schema
How do I fix visual alignment and typography drift before a UI release?▼

Fix visual alignment and typography drift by enforcing design tokens, spacing, and typography hierarchy across components. This polish workflow aligns visuals to the design system, ensuring consistent interaction states and reducing UI drift for a release-ready product.

What is the best way to ensure color contrast and accessibility compliance during a UI polish pass?▼

The best way to ensure color contrast and accessibility compliance is to apply a polish workflow that enforces design tokens and color contrast guidelines. This process identifies drift from accessibility considerations and resolves interaction state issues across responsive states.

How do I align interaction states and motion guidelines to a design system?▼

Align interaction states and motion guidelines by applying a structured polish workflow that enforces design system rules. This ensures components adhere to motion guidelines and maintain consistent interaction states, reducing visual drift across the application.

Can I use this polish workflow for responsive states and pre-launch UI reviews?▼

Yes, you can use this polish workflow for responsive states and pre-launch reviews. It elevates a product from MVP to flagship polish by aligning visuals, fixing micro-details, and enforcing design tokens across responsive behavior and accessibility considerations.

Why does UI design system drift happen and how do I resolve it?▼

UI design system drift happens when components deviate from spacing, typography, and color contrast guidelines over iterations. Resolve it by running a final polish pass that enforces design tokens, identifies visual misalignment, and corrects interaction details.

Related Skills

Explore More Design & Creative Skills→
mrodrigues1mrodrigues1

visual-design-foundations

Define visual design systems using typography, color, spacing, and iconography.

Community
Intermediate
yckkkkyckkkk
1

polish

Inspect UI components for alignment, spacing, typography, and interaction states.

Community
Advanced
t-stringst-strings

Frontend Accessibility

Review frontend UI code for HTML semantics, ARIA, keyboard navigation, and contrast.

Official
Basic
Ankurjain1121Ankurjain1121

UI Audit

Audit React UI components for style, accessibility, and UX issues.

Community
Advanced