The skills I use every day

Reviews a screen, a flow, a branch or a pull request through every interface skill and returns one ranked verdict, with a file and line on every finding.

Finish with exact values: concentric radius, shadows instead of borders, image outlines, optical alignment, a 0.96 press, icon swaps, enters, exits and gestures.

How text renders: choosing and loading fonts, the type scale, line height, balance and pretty wrapping, tabular numbers, truncation and punctuation.

The color system: OKLCH ramps, role-based tokens, format conversion, gamut, contrast measured on the pair that actually renders, and dark mode.

Keyboard and focus, accessible names, semantics, forms, screen readers, hit areas and reduced motion, against WCAG 2.2.

Grouping, alignment, reading order, breakpoints that come from the content and room for translated text, so a layout holds up when it is resized, translated or mirrored.

Interface copy: labels that name the action, errors that say what to do, empty states that teach and confirmations that name the consequence.

Three genuinely different versions of a component, on an axis you name, behind a switcher on the real page. You flip between them and promote the winner.

Explains how an interface, effect or animation on another site was built, separating what it measured from what it inferred, and ends with the recipe that carries over.

Renders a component under every scenario that can reach it in production, huge text, zero items, 320px, RTL, on a temporary page, and marks what broke.

A workbench with every state of a component, loading, empty, error, plan and permission, with mock data and a keyboard switcher, to work on one at a time.

Builds from a Figma link or a screenshot, with the project's own tokens and components, and compares side by side before calling it done.

A hard interview before building, one question at a time, until no decision is left open.

1. Who can cancel: the customer, support, or both?
   I'd say both, with a required reason for support.

A new project: a stack with a written rationale, security from day one, reproducible infrastructure and the feedback loop before the first commit.

Stack       Next.js + Postgres, because…
Security    headers, secrets out of the repo, CI with audit
Loop        lint + types + tests running before the 1st commit

Red, green, refactor, one vertical slice at a time.

✗ prorates a mid-cycle upgrade      red, for the right reason
✓ prorates a mid-cycle upgrade      green, the minimum
↺ extract daysLeft()                refactor, still green

Hard bugs and performance regressions, in six phases with a gate between each: reproduce, isolate, minimize, explain, fix, lock.

Phase 1  Reproduced: 2 deliveries 40ms apart
Phase 3  Minimal: no lock on the idempotency key
Gate     a red test before the fix, green after

The diff on two axes that do not contaminate each other, standards and spec, in parallel subagents.

Standards  2 findings   bare catch in billing.ts:88
Spec       1 finding    the partial refund in the issue is missing

An audit across every layer, security first, starting from a non-negotiable baseline of ten items, with the specific fix on every finding.

[CRITICAL] unbounded query in payouts.ts:41
[HIGH]     retry without backoff on the gateway
Verdict    fix first

Five required checks, real end-to-end flows, edge cases, and what should be tested and isn't.

✓ build, types, lint, tests, happy path
✗ coupon expiring mid-checkout: 500
Gap: no test covers currency changes

An audit in three levels, and the third chains medium findings until they become critical.

Chain: sequential IDs + no ownership check + email in the response
       = anyone can list every customer [CRITICAL]

A security gate, reproducibility from a clean clone, and the checks for each way of shipping.

✓ a clean clone builds and boots
✗ .env.example is missing STRIPE_WEBHOOK_SECRET
✓ reversible migrations, a real health check

The router over all the others. Describe the situation and it tells you which skill solves it, and why.

/break: renders the card with the worst content on one page
and names the skill that owns each break.