A final review guide for improving an interface's spacing, alignment, consistency, interaction states, wording, loading behavior, and small visual details.

It is for carrying out a systematic finishing pass on a web interface.

It helps catch quality issues after the feature is functionally complete and before it ships.

How Southclaws/storyden configures Claude Code

Reuse

Borrowing it

Nothing to install: this file belongs to Southclaws/storyden. Take a copy, put it at the same path in your own repository, and replace the rules that are about this project with yours.

Copy the file

curl -O https://raw.githubusercontent.com/Southclaws/storyden/main/.agents/skills/polish/SKILL.md

Clone the repo

git clone --depth 1 https://github.com/Southclaws/storyden

Made for: Claude Code.

Wrote this? Show the measurements

A badge with what this costs and how it scanned, read live from this page, so it follows the numbers instead of freezing them. Markdown for a README, HTML for a documentation site or a project page.

README.md

[![agentmods](https://agentmods.dev/badge/skills/southclaws/storyden/polish/github.svg)](https://agentmods.dev/skills/southclaws/storyden/polish)

Your own site

<a href="https://agentmods.dev/skills/southclaws/storyden/polish"><img src="https://agentmods.dev/badge/skills/southclaws/storyden/polish/github.svg" alt="Measured on agentmods" height="20"></a>

Or the 80×15 button, for a site that already has a row of RSS and ATOM ones. Only the verdict fits; the numbers stay here.

Your own site · 80×15

<a href="https://agentmods.dev/skills/southclaws/storyden/polish"><img src="https://agentmods.dev/badge/skills/southclaws/storyden/polish.svg" alt="Reviewed on agentmods" width="80" height="20"></a>

Per session 26 Skills are progressive disclosure: only the name and description are preloaded; the body loads when the skill is used.

When invoked 1,827 The whole file, excluding the scripts and references it only reads on demand.

Security scan A 0 findings. A grade says what 26 rules found in the file — not that it is safe.

Origin 84% copy Near-identical to another mod in the catalogue.

Token cost

What it costs to keep this loaded

Counted locally with the o200k_base tokenizer, which is exact for GPT models; Claude uses its own tokenizer and its counts differ. Treat this as one consistent yardstick across the catalogue rather than a bill. Prices are per million input tokens.

Model	Per session	Once invoked
Fable 5.1	$0.00026	$0.01827
Opus 5.5	$0.00010	$0.00731
Sonnet 5.5	$0.00005	$0.00365
Haiku 4.5	$0.00003	$0.00183

Measured 2mo ago against content hash c2c2a2677fec, method: parsed. Prices are Anthropic first-party input rates as of 2026-10-07, from the pricing page.

Security

Grade A, and why

polish scanned grade A with 0 findings against 26 rules in 11 categories — prompt injection, anti-refusal, data exfiltration, privilege escalation, supply chain, agent snooping, system-prompt leakage, SSRF and excessive agency — measured 2mo ago.

A static scan of the body, not an audit. Every finding is printed with the line that produced it so you can judge whether it matters here. A mod is markdown that instructs an agent; that is exactly why what it instructs is worth reading.

Nothing flagged

None of the 26 patterns this scan looks for appear in this file: no shell pipes, no recursive deletes, no credential paths, no hidden text, no instruction-override or anti-refusal phrasing, no agent-config snooping. That is not a guarantee, it is the absence of the things that are checkable.

Origin

This is a copy

84% identical to polish — 10 lines differ, which has more behind it and is treated as the original. This page carries a canonical link to it rather than competing with it.

.agents/skills/polish/SKILL.md · 202 lines

How it starts

The opening of the file, as written. The whole thing — 202 lines — stays where its author put it; the contents beside it link to each section on GitHub.

MANDATORY PREPARATION

Use the frontend-design skill — it contains design principles, anti-patterns, and the Context Gathering Protocol. Follow the protocol before proceeding — if no design context exists yet, you MUST run teach-impeccable first. Additionally gather: quality bar (MVP vs flagship).

Perform a meticulous final pass to catch all the small details that separate good work from great work. The difference between shipped and polished.

Pre-Polish Assessment

Understand the current state and goals:

Review completeness:
- Is it functionally complete?
- Are there known issues to preserve (mark with TODOs)?
- What's the quality bar? (MVP vs flagship feature?)
- When does it ship? (How much time for polish?)
Identify polish areas:
- Visual inconsistencies
- Spacing and alignment issues
- Interaction state gaps
- Copy inconsistencies
- Edge cases and error states
- Loading and transition smoothness

CRITICAL: Polish is the last step, not the first. Don't polish work that's not functionally complete.

Polish Systematically

Work through these dimensions methodically:

Visual Alignment & Spacing

Pixel-perfect alignment: Everything lines up to grid
Consistent spacing: All gaps use spacing scale (no random 13px gaps)
Optical alignment: Adjust for visual weight (icons may need offset for optical centering)
Responsive consistency: Spacing and alignment work at all breakpoints
Grid adherence: Elements snap to baseline grid

Check:

Enable grid overlay and verify alignment
Check spacing with browser inspector
Test at multiple viewport sizes
Look for elements that "feel" off

Typography Refinement

Hierarchy consistency: Same elements use same sizes/weights throughout
Line length: 45-75 characters for body text
Line height: Appropriate for font size and context
Widows & orphans: No single words on last line
Hyphenation: Appropriate for language and column width
Kerning: Adjust letter spacing where needed (especially headlines)
Font loading: No FOUT/FOIT flashes

Read the full file on GitHub · 202 lines

Changes

What this file has done since we first saw it

Hashed on every crawl. A supply-chain change to an agent config is a question of when, not whether, so the history is kept rather than the latest state alone.

2mo ago First seen · 202 lines · 26 tokens per session scan A c2c2a2677fec

Subscribe to this mod's changes

polish is a skill published in the GitHub repository Southclaws/storyden (346 stars, last pushed 3d ago), licensed MPL-2.0. It adds 26 tokens to every session and 1,827 once invoked, about $0.0001 per session on Opus 5.5. A static security scan graded it A with 0 findings. It is 84% identical to polish, differing in 10 lines, and is treated as a copy.

Design and UX discussion-board discussion-forum forum forum-application forum-software forums

polish next to 6 skills from other repositories
Mod	Type	Stars	Last push	Licence	Scan	Tokens	Works with
polishSouthclaws/storyden	Skill	346	3d ago	MPL-2.0	A	26	Claude Code
webgl-holographic-foilnexu-io/open-design	Skill	106k	yesterday	Apache-2.0	A	41	Claude Code, Codex
html-ppt-hermes-cyber-terminalnexu-io/open-design	Skill	106k	yesterday	Apache-2.0	A	53	Claude Code, Codex
html-ppt-taste-brutalistnexu-io/open-design	Skill	106k	yesterday	Apache-2.0	A	78	Claude Code, Codex
visual-ralphYeachan-Heo/oh-my-codex	Skill	34k	3d ago	MIT	A	52	Codex
glance-canonical-layoutsandroid/skills	Skill	10k	yesterday	Apache-2.0	A	56	Claude Code
accessibilitymicrosoft/hve-core	Skill	1.6k	yesterday	MIT	A	47	Claude Code

storyden: Skill for Claude Code