Get Code Review Rules

Retrieves accessibility (WCAG 2.1), visual design, animation, content, comprehension, and AI feature review rules for analyzing code.

You MUST call this after writing UI code to self-review your output, then fix every critical and serious issue BEFORE presenting the result.

It returns rules to check against. It approves nothing: a clean self-review against these rules is not visual approval, because the rules are read against source, not against what renders.

Match the requested change

Classify the request as repair, polish, or redesign: restore behavior, refine layout, or rebuild layout and components. Follow the user's scope, not analytics-only tool context. Do not downgrade redesign to polish, expand repair, or turn token export/source inspection into a redesign.

Keep the selected design system and assigned icon family/variant unless the user requests a change. Use exact returned icon names/source, never substitute packs, emoji, or invented SVGs. Inventory sections, components, states and responsive layouts; map requested patterns to real system components and record missing primitives.

Plan structural changes and component adoption before redesigning. Rebuild the requested hierarchy, layout and interactions; token swaps and unused imports do not count. Preserve unrelated behavior, accessibility and production/control boundaries.

Preserve all supplied paragraphs, reviews, offer details, links and disclosures, including collapsed answers and inactive tabs, unless the user requests cuts or rewrites. Require a source-to-render content comparison; investigate every omission, not just section counts. A shortened fixture is not a completed page. Label partial prototypes and never treat their checks as full-page evidence.

Compare before/after renders of the same content and states at the same desktop and mobile widths. Show which planned structural changes and component adoption are visible; verify the selected icons, spacing, hierarchy, and working interactions. Copy and accessibility fixes alone do not complete a redesign. Tool calls, generated files, or a source-only review are not visual evidence. If a baseline or rendered check is unavailable, name the missing evidence and report the redesign as unverified. Keep all existing build, accessibility, hover, comprehension, and review gates.

Explain design trade-offs

Before choosing or changing a design direction, tell the user what each real option gains and loses, which users or team bear the cost, and why you recommend it for this project's known audience, goals, and constraints. Use a short line per option: "Gain: ...; lose: ...; affects: ...; fits because: ...". Load get-ux-principle with topic "tradeoffs" when deeper guidance is needed.

Use the current conversation and project evidence. Label assumptions and predicted effects. Do not invent research, conversion gains, metrics, or project facts. If the user has already chosen, explain the accepted trade-off without reopening the choice. Keep minor edits brief; this adds no approval step and never excuses an accessibility or safety failure.

Put the explanation in the conversation or requested project handoff, not extra product UI copy. Before presenting the result, check that material gains and losses were communicated and report any changed trade-off.

Accessibility (WCAG 2.1):

• Critical: Images without alt text, icon buttons without aria-labels, form inputs without labels

• Serious: Focus outline removed, missing keyboard handlers, color-only information

Visual Design:

• Layout & Spacing: Inconsistent spacing, overflow issues, z-index conflicts

• Typography: Mixed fonts, line-height issues, missing fallbacks

• Color & Contrast: Contrast below 4.5:1, missing hover/focus states

• Component fidelity: Feature code that bypasses installed Sidebar and Table compositions

• Dashboard hierarchy: Verify title → metrics → records → interpretation, preserve supplied overview copy, distinguish action and status colors, reject invented trends, and reject a stepper on a dashboard overview

• Serious: Hover outside @media (hover: hover) and (pointer: fine), hover that moves controls, or hover that overrides selected/pressed styling

• Serious: Dormant creation forms exposed on browse/manage pages instead of opening from a labeled CTA

Animation & Motion:

• Critical: Reduced-motion paths that hide content or prevent completion

• Serious: Motion that delays frequent tasks, breaks under repeated input, uses a disconnected origin, or misses frames under representative load

• Moderate: Choreography that competes with hierarchy or drifts from the product's motion tokens

Content (generated-UI tells):

• Apply these to every visible element, including the text inside a mock product screen, dashboard, table or chat panel shown on a sales page, deck or social image. Filler hides there most often

• Walls of text, overwritten copy, filler adjectives, emoji used as icons

• Ceremonial copy with no user job; run the deletion test before shipping visible text

• Serious: A second visible page title or introduction that only repeats the page, tabs, or adjacent controls

• Awkward headline or subtitle wraps that split complete phrases or leave orphaned words

• Microcopy details: pluralization, improvised unit glyphs, empty states without a next action

• Template layouts: gradient hero + eyebrow pill, left-border callout boxes

• Reward feedback: confirm the outcome, surface proportional user value, and avoid decorative over-reward

• Prose tells in shipped paragraphs (hero, about, pricing, changelog, docs): banned words (delve, leverage, robust, cutting-edge, elevate), binary contrasts ("It's not X, it's Y"), throat-clearing and faux-insight openers, colon reveals, puffery and unsourced "experts agree", fake-profound kickers and recap endings, synonym cycling, emoji headings and mid-sentence bold

Comprehension (would someone outside the team understand it?):

• Mom test: insider vocabulary, unexplained acronyms, sentences too long to follow

• 15 second test: word count, stacked concepts, competing actions

• Screenshot test: missing title, actions that hide their outcome, icon-only controls

• Run these against the real copy with check-comprehension once the screen exists

AI features (any surface that shows model output or sends user data to a model):

• Critical: Output saved or sent without the user accepting it, silent failures, no manual path when AI is unavailable, user data read before consent, invented citations or unearned certainty

• Serious: AI output with no visible marker, long runs with no sign or a Stop that deletes partial output, refusals that name no topic and offer no alternative, feedback controls with no destination

Every rule carries an ID (rule/…), a source and an exceptions line. Cite the ID in each finding. The coverage-gaps category lists the surfaces that have no rule yet.

Use maxTokens to limit rule content (recommended: 5000–10000). Required workflow guidance is always returned in full.