Figma Mcp

Refer to the standard: @standards/frontend/FIGMA_MCP_USAGE.md Also read @packages/ui/CLAUDE.md for color token mapping and component conventions.

Steps

1. Parse the Figma URL from $ARGUMENTS — extract the fileKey and nodeId. Convert - to : in the node ID.
2. Read the standards above for the available tools, adaptation rules, and color usage.
3. Call get_design_context with the extracted nodeId and fileKey, using clientLanguages: "typescript,html,css" and clientFrameworks: "vue". This is always the first tool to call.
4. Adapt the output to the Modrinth codebase:
   • Map Figma color variables to surface-* / text-* tokens — never use Figma's aliased names directly.
   • Check packages/ui/src/components/ for existing components that match elements in the design (buttons, cards, modals, inputs, etc.).
   • Check for tokens not exposed in Figma.