WORK WITH YOUR STACKAvailable

UXDL with Figma

Figma communicates visual design; UXDL communicates addressable behavior.

Figma Boundary

Rendering diagram...

Figma owns visual presentation; UXDL owns behavioral state graph.

Linking Figma Frames to UXDL Addresses

Attach exact Figma frame URLs directly onto screen nodes using open metadata:

YAML

1screens:
2  checkout:
3    name: Checkout Overview
4    type: page
5    metadata:
6      figma_url: "https://www.figma.com/design/xyz/App?node-id=102-45"
7      figma_component: "Checkout/MainContainer"