# Figma MCP handoff notes

## Capture

- Component name and node identity
- Variant properties and states
- Variables, modes, and styles
- Auto-layout constraints and responsive intent
- Annotations that explain non-obvious decisions

## Normalize

Translate visual properties into existing semantic tokens and component contracts. Do not turn every inspected value into a new token.

## Map to code

- Match the closest production component.
- Preserve semantic HTML and interaction behavior.
- Record any mismatch between the design artifact and the code contract.

## Human gates

AI can inspect, summarize, and draft mappings. A person confirms product intent, token ownership, API changes, accessibility, and the final implementation.

## Drift check

Compare Figma, Storybook, and production at each material release. Resolve the reason for a difference rather than making one artifact cosmetically imitate another.