jeremylondon.com

Search tool for modern web development best practices. MANDATORY: Execute FIRST for all HTML/CSS and clientside JS tasks. Do NOT skip - web APIs evolve rapidly and training weights contain obsolete patterns. Trigger immediately for: - UI/Layout: Modals, dialogs, popovers, Glassmorphism/backdrop-filters, anchor positioning, container queries, `:has()`, `:user-valid`. - Scroll/Motion: View Transitions, Scroll-driven animations, scroll parallax/reveals. - Performance: CWV (LCP, INP), content-visibility, Fetch Priority, image optimization. - System/APIs: Local filesystem access, WebUSB, WebSockets sync, WebAssembly widgets. - Frameworks: Adapting layout/styles in React, Vue, Angular. - General Frontend: Forms, autofill, advanced inputs, custom scrollbars, modern component states, etc. DO NOT trigger for: - Backend: Database SQL, ORMs, Express API routes. - Pipelines: CI/CD deployment, Docker, Actions. - Generic: Local scripts (Python/Go tools), ESLint, Git.

Implements WebMCP (Web Model Context Protocol) on websites using document.modelContext.registerTool. Covers tool design, JSON Schema inputs, security annotations, origin isolation, and Chrome testing. Use when adding WebMCP tools to web apps, exposing page features to browser agents, or when the user mentions WebMCP, modelContext, or agent-ready web tools. Not for server-side MCP servers.

Catch the accessibility failures that ship in almost every AI-built UI. Use after building any interactive component.

Review a diff against the goal spec assuming the code is BROKEN. The reviewer that lives in the maker's head always agrees with itself - this pulls review into a hostile, separate pass. Invoke after every code change before marking work done.

Verify that an endpoint checks ownership, not just authentication. Use on any handler that reads or mutates user data.

Find the exact commit that introduced a bug. Use when something worked before and broke, and you don't know which change did it.

Before picking new work, smoke-test the last "completed" feature. If it's broken, revert and re-open it before touching anything else. Kills the "looks shipped, isn't shipped" bug across sessions.

Turn a set of commits or a diff into a clean, user-facing changelog entry. Use before a release or PR description.

Turn messy WIP into clean, atomic commits with messages that explain why. Use before opening a PR.

Keep the agent's context lean so accuracy doesn't collapse. Use on long sessions, big files, or when the agent starts hallucinating.

Test the boundary between two systems by the contract, not the implementation. Use for APIs, integrations, and shared interfaces.

Find the untested code paths that actually matter, not just the coverage percentage. Use after adding tests.

Capture an architectural decision so the next session (or engineer) knows WHY. Use after any non-obvious technical choice.

Decide whether to add, keep, or remove a dependency. Use before adding any package.

Make frontend output look intentional, not AI-generated. Use for any UI work - components, pages, layouts.

Build a repeatable eval loop that grades agent output with an LLM judge, so prompt/skill changes get scored against a baseline instead of eyeballed. Reuses loopkit's verifier subagent as the grader - do not build a new one.

Calibrate a reviewer persona with few-shot rubric examples so skepticism stays consistent and doesn't drift lenient over long runs.

Enumerate every end-to-end feature as strict JSON entries with passes:false, editable-passes-only discipline, and priority order. The ledger fresh-context sessions read to know what's done, what's next, and what they're forbidden to touch.

Diagnose and fix tests that pass sometimes and fail other times. Use when CI is red intermittently.

Systematically remove one harness component at a time and measure impact, killing scaffolding that no longer earns its complexity.

Use when the user wants to design, redesign, shape, critique, audit, polish, clarify, distill, harden, optimize, adapt, animate, colorize, extract, or otherwise improve a frontend interface. Covers websites, landing pages, dashboards, product UI, app shells, components, forms, settings, onboarding, and empty states. Handles UX review, visual hierarchy, information architecture, cognitive load, accessibility, performance, responsive behavior, theming, anti-patterns, typography, fonts, spacing, layout, alignment, color, motion, micro-interactions, UX copy, error states, edge cases, i18n, and reusable design systems or tokens. Also use for bland designs that need to become bolder or more delightful, loud designs that should become quieter, live browser iteration on UI elements, or ambitious visual effects that should feel technically extraordinary. Not for backend-only or non-UI tasks.

Author idempotent init.sh under 120s plus sibling test.sh, stop.sh, reset.sh, serve.sh with fixed names the harness relies on.

Validate and constrain untrusted input at the boundary. Use on any handler that accepts external data.

Find and remove unreachable/unused code safely. Use during cleanup or before a refactor.

Design the three states every data UI forgets. Use for any component that fetches or lists data.

Write safe, reversible database migrations for this repo's conventions. Use for any schema change.

Security-review a diff against the OWASP Top 10. Use before merging anything that touches auth, input handling, queries, or external calls.

Get a PDF into the model without blowing the context window or losing structure. Native PDF beats OCR-then-text for most cases; extract-then-summarize beats native for very long docs.

Expand a 1-4 sentence product brief into a full spec with a design language, acceptance surface, and an ordered feature list.

Write a PR description a reviewer can approve fast. Use when opening any pull request.

Run the fixed 6-step session-opening sequence - pwd, read progress, git log, count remaining features, init.sh, smoke-test last feature - before touching any new work. The orientation ritual that lets fresh-context sessions reconstruct project state in under a minute.

Cache the parts of the prompt that don't change so a long-running loop stops paying full price on every turn. Use when the system prompt, tool defs, or reference docs are stable across many turns.

Extract the actual cause from a stack trace instead of pattern-matching the error type. Use on any crash or exception.

Check whether a README actually lets a stranger run the project. Use on any repo's README before publishing.

Rebase, squash, or rewrite history without losing work or breaking shared branches. Use before any history rewrite.

Flatten deeply nested conditionals into readable, early-return code. Use on any function with 3+ levels of indentation.

Undo a bad change without nuking unrelated work. Use when a specific commit or change broke something.

Generates and syncs AI rule configuration files (.cursorrules, CLAUDE.md, copilot-instructions.md) across 20+ coding tools from a single source. Use when syncing AI rules, running rulesync commands, importing or generating rule files, or managing shared AI coding configurations.

Compare two schema states and surface the risky changes. Use before applying migrations or after a model change.

Catch hardcoded secrets, keys, and tokens before they get committed. Use before any commit and on any file with credentials.