URL analysis vs screenshot analysis: when to use each

There are two fundamentally different ways to read a design: from its implementation, or from its pixels. They produce different kinds of truth.

URL analysis: implementation truth

Reading a live page's computed styles yields exact values - the hex that's really in the CSS, the cubic-bezier the transitions really use, the custom properties the team really named. It also captures what pixels can't show: hover states, scroll-triggered animation, the full page beyond one viewport.

Use it when the design is live, publicly reachable, and what you want is the system as built.

Its limits: login walls, bot-blocking, and states the crawler can't reach.

Screenshot analysis: visual truth

A screenshot carries no implementation - every value must be estimated from pixels. Skilled estimation gets close on color and layout, less close on precise spacing, and can say nothing about motion. Honest tooling marks these outputs as estimates rather than dressing them up as extractions.

Use it when there's no URL: mockups, design explorations, apps, blocked sites - or when the specific visual state matters more than implementation detail.

Both together: intent plus truth

The strongest option, when available, is both at once: the URL supplies exact values, the screenshot declares which visual state you mean. Specify a dark-mode variant with real values from the light-mode-defaulting site; pin a campaign layout the crawler wouldn't have landed on.

In Mateo, URL-only is available on every plan; screenshot-only and combined analysis are Pro and Max features. The docs cover each mode's mechanics in more detail.