The problem

Design QA is a loop of small checks: is this 16px or 15px, does this grey pass AA, which tracker fired before consent, does it break at 390px wide. DevTools answers each one, but never in the shape a designer or a reviewer thinks in. And once you find the fix, you still have to carry it back into the codebase by hand.

What fouc.app is

fouc.app is one dock you can place on any edge of any page. It is built from scratch for Chrome Manifest V3 with no framework in the page, so it never fights the site it sits on.

Inspect and measure. Hover for size, type, colour and contrast. Hold ⌥ to measure the distance between elements. Layout overlays show flex direction, grid tracks and the constraint lines of absolutely positioned elements.
Edit like a design tool. A Design tab with auto-layout, fill, stroke and type controls, plus a live box model you can drag to scrub. Every change is tracked, undoable and exportable as a CSS diff.
Colour. A loupe picker, HEX/RGB/HSL/OKLCH, and a contrast checker that suggests the nearest passing colour for AA or AAA.
Privacy and compliance. Network requests grouped by tracker category, trackers that fired before the first interaction, cookies, consent platform detection, banner Reject-button parity, and a DPDPA readiness scan. These are heuristic checks, not legal advice.
Test. Record a flow and export Playwright, Cypress or Puppeteer.

The agent bridge

The part I like most: a small local server (Node, Hono) exposes the live page to coding agents over MCP. An agent can call get_selection, get_styles, apply_css or get_changes, so the loop becomes tweak in the browser, queue for the agent, the agent ports the CSS diff into the repo. API keys stay on the local server and never enter the browser, and it answers only chrome-extension:// origins.

A design language of its own

Because fouc.app sits on top of someone else’s page it needs a voice that cannot be confused with the page. I drew it as a node lattice: hairlines, square nodes where lines meet, ruled cells and leader lines that join every callout to its subject. Numbers are tabular monospace and every number is copyable.

Engineering decisions

Isolation first. All UI lives in its own root so host-page CSS cannot leak in and fouc.app’s cannot leak out.
Local by default. Nothing leaves the machine unless you connect a service; there is a public privacy policy and a store listing written to match.
Optional collaboration. A SQLite-backed server adds live cursors anchored to elements, comment threads and “send to agent” hotspots.

Status

fouc.app is built and will be released on the Chrome Web Store soon. Follow @dee_ajith on X for the launch.