[Request/Question] Possibility to add figma tokens/variables in the simpified response.

Author: UhriGCreated Feb 28, 2025Updated Oct 24, 2025
Labelsenhancement

First of all thanks for the great work on the Figma MCP Server! It’s been incredibly helpful for me with Cursor, especially for one-shotting designs with Figma data.

I’ve noticed that the simplified response doesn’t include Figma variables, even though the raw response shows boundVariables with variable IDs. I’d love to get variable references in the output. Could you guide me on what’s needed to include these?

Figma Styles:

  • color: var(--text-text-primary, #FFF);
  • font-family: var(--font-font-family-title, Futura);
  • font-size: var(--font-font-size-3xl, 40px);
  • font-style: normal;
  • font-weight: 500;
  • line-height: 120%; /* 48px */

What We Get

  • Raw:

    json
    "children": [
      {
        "id": "726:30785",
        "name": "Heading",
        "type": "TEXT",
        "boundVariables": {
          "fills": [{"type": "VARIABLE_ALIAS", "id": "VariableID:1116:94605"}],
          "fontFamily": [{"type": "VARIABLE_ALIAS", "id": "VariableID:1085:140079"}],
          "fontSize": [{"type": "VARIABLE_ALIAS", "id": "VariableID:1092:105397"}],
          "fontStyle": [{"type": "VARIABLE_ALIAS", "id": "VariableID:1092:105386"}]
        },
        "style": {
          "fontFamily": "Futura",
          "fontSize": 40,
          "color": {"r": 1, "g": 1, "b": 1, "a": 1}
        }
      },
      {
        "id": "726:30786",
        "name": "Lorem ipsum dolor sit amet, consectetur adipiscing elit.",
        "type": "TEXT",
        "boundVariables": {
          "fills": [{"type": "VARIABLE_ALIAS", "id": "VariableID:1116:94605"}],
          "fontFamily": [{"type": "VARIABLE_ALIAS", "id": "VariableID:1091:101902"}],
          "fontSize": [{"type": "VARIABLE_ALIAS", "id": "VariableID:1092:105392"}],
          "fontStyle": [{"type": "VARIABLE_ALIAS", "id": "VariableID:1092:105385"}]
        },
        "style": {
          "fontFamily": "Nunito",
          "fontSize": 16,
          "color": {"r": 1, "g": 1, "b": 1, "a": 1"}
        }
      }
    ]
  • Simplified:

    json
    "children": [
    {
    "id": "726:30785",
    "name": "Heading",
    "type": "TEXT",
    "text": "Lorem Ipsum Dolor",
    "textStyle": {
      "fontFamily": "Futura",
      "fontWeight": 500,
      "fontSize": 40,
      "lineHeight": "1.2em",
      "textAlignHorizontal": "LEFT",
      "textAlignVertical": "TOP"
    },
    "fills": [{"type": "SOLID", "hex": "#FFFFFF", "opacity": 1}],
    "color": "#FFFFFF"
    },
    {
    "id": "726:30786",
    "name": "Lorem ipsum dolor sit amet, consectetur adipiscing elit.",
    "type": "TEXT",
    "text": "Get to know the talented individuals behind our company.",
    "textStyle": {
      "fontFamily": "Nunito",
      "fontWeight": 400,
      "fontSize": 16,
      "lineHeight": "1.5em",
      "textAlignHorizontal": "LEFT",
      "textAlignVertical": "TOP"
    },
    "fills": [{"type": "SOLID", "hex": "#FFFFFF", "opacity": 1}],
    "color": "#FFFFFF"
    }
    ]
  • Desired Simplified Response:

    json
    {
    "children": [
     {
       "id": "726:30785",
       "name": "Heading",
       "type": "TEXT",
       "text": "Lorem Ipsum Dolor",
       "textStyle": {
         "fontFamily": "var(--font-font-family-title, Futura)",
         "fontWeight": "500",
         "fontSize": "var(--font-font-size-3xl, 40px)",
         "lineHeight": "120%", 
         "textAlignHorizontal": "LEFT",
         "textAlignVertical": "TOP"
       },
       "fills": [
         {
           "type": "SOLID",
           "color": "var(--text-text-primary, #FFFFFF)"
         }
       ],
       "color": "var(--text-text-primary, #FFFFFF)"
     },
     {
       "id": "726:30786",
       "name": "Lorem ipsum dolor sit amet, consectetur adipiscing elit.",
       "type": "TEXT",
       "text": "Get to know the talented individuals behind our company.",
       "textStyle": {
         "fontFamily": "var(--font-font-family-title, Nunito)",
         "fontWeight": "400",
         "fontSize": "var(--font-font-size-3xl, 16px)",
         "lineHeight": "150%", 
         "textAlignHorizontal": "LEFT",
         "textAlignVertical": "TOP"
       },
       "fills": [
         {
           "type": "SOLID",
           "color": "var(--text-text-primary, #FFFFFF)"
         }
       ],
       "color": "var(--text-text-primary, #FFFFFF)"
     }
    ]
    }