Here's the workflow that's become default in every design-to-code team right now: export a frame from Figma, paste the PNG into Claude or Cursor, type "build this", and iterate on the hallucinated output. It works just well enough to feel productive. It doesn't work well enough to ship from.
This isn't a model capability problem. It's an input problem. A screenshot is the worst possible representation of a Figma design for an LLM to reason about — and yet it's almost universally what teams reach for first. The structured alternative is what figmascope exports: a context bundle of typed IR, design tokens, component inventory, and UI strings that the agent can read instead of guess. Let's walk through everything a screenshot silently destroys.
The hierarchy is gone
A Figma file is a tree. Frames contain auto-layout groups, which contain component instances, which contain text and fill layers. That tree encodes the layout intent: this row is a flex container, this card is a padded box, these three items are siblings with 16px gaps between them.
A screenshot flattens that tree to a grid of pixels. The LLM sees shapes and colors. It does not see the layout structure — it infers it. And inference is lossy in both directions: the model may reconstruct structure that looks right visually but is wrong semantically (a fixed-width div instead of a flex child, absolute positioning instead of auto-layout), or it may see structural ambiguity and pick one arbitrarily.







