ui-polish

Installation
SKILL.md

UI Polish

1. Read the room first

  • Detect the stack: Tailwind (tailwind.config.* / @import "tailwindcss"), CSS Modules, styled-components, shadcn/ui (components/ui/), plain CSS.
  • Reuse existing design tokens: colors, fonts, spacing, radius, existing components. Never invent a second button style when one exists.
  • If there's no design system, set one small set of tokens (CSS variables or Tailwind theme) before writing components.

2. Pick a direction, not defaults

Before coding, decide in one line: the mood (e.g. "calm editorial", "bold startup", "warm local business") and what that means for type, color and density. Avoid the generic look: centered purple gradient hero, three identical icon cards, everything rounded-2xl shadow-lg.

3. Fundamentals checklist

Typography

  • Max 2 font families. Body 16–18px, line-height 1.5–1.7; headings tighter (1.1–1.25).
  • Line length 60–75 characters (max-w-prose / max-width: 65ch).
  • Clear scale (e.g. 14/16/20/24/32/48) — don't pick random sizes.
Installs
1
First Seen
Today