Design Teardown

Figure out why a design works (or doesn't), without leaving the page.

Figure out why a design works (or doesn't), without leaving the page. Design Teardown is a growing toolkit for deconstructing web pages and apps, layout guides, spacing checks, color extraction, and more, laid directly over the page you're already looking at. Two tools so far. Uniform Grid lays a pixel grid over the page, sized, colored, and dialed to whatever opacity keeps it useful without getting in the way. Typography Audit reports every font stack on the page, in-use vs. fallback, and lets you highlight any in-use font's text live on the page to see exactly where it's rendered. No DevTools, no screenshot round-trip, just the answers laid over the page you're already looking at. More tools land as they're built. If you care how a page is actually put together, this is for you.