Skip to main content
David_Yeiser
David_Yeiser
March 18, 2021
Question

Get values associated with styles with files/styles API call

If I hit the file styles endpoint:
https://api.figma.com/v1/files/<key>/styles

I get an array of objects like so:

{
  "created_at": "2021-03-18T10:57:00.885Z",
  "description": "",
  "file_key": "…",
  "key": "…",
  "name": "red",
  "node_id": "2:5",
  "sort_position": """,
  "style_type": "FILL",
  "thumbnail_url": "…",
  "updated_at": "2021-03-18T10:57:00.885Z",
  "user": {
    …
  }
}

However what I also need is the value of that style. E.g. "value": "#ff0000"

Is there a way to get this? If not, can this be added?

    This topic has been closed for replies.

    17 replies

    OleZha
    OleZha
    May 3, 2021

    Same problem. I see the way, but this way will be dumb.
    As the first query → getting styles using https://api.figma.com/v1/files/:file/styles.
    As other queries → Getting properties from each style using https://www.figma.com/file/:key/:pageNames?node-id=:node_id

    Arthur_Ivanov
    Arthur_Ivanov
    May 15, 2021

    Same issue here, I was trying to use GET style, but there is no values either
    https://www.figma.com/developers/api#get-style-endpoint

    Christian_Areskar_Hovstadius
    Christian_Areskar_Hovstadius
    August 16, 2021

    I was also wondering about this. It feels like the most important thing that you’re looking for in a style object would be its value. Is there a plan to include them going forward?

    Nicole_Redmond
    Nicole_Redmond
    October 12, 2021

    Just bumping this. Would really love to see this implemented - the API is really limited if we can’t get the style value.

    Marty_Brutvan
    Marty_Brutvan
    November 9, 2021

    I am bumping this once again. Has anyone heard anything from Figma regarding this discrepancy in the styles data object?

    Nuno_Ferreira
    Nuno_Ferreira
    December 10, 2021

    I think you can get the style values by querying for the nodes associated with it.
    files/<key>/styles will give all the styles and in particular will give you the node_id of the node associated with that style.
    You then do files/<key>/nodes?ids=<node_id-1>,<node_id-2>,<node_id-n> to get the information of all the nodes associated with the styles.
    From the node you should be able to get the fills, effects, etc. which are the style values you’re looking for.

      Daniel_Golden1
      Daniel_Golden1
      January 4, 2022

      Bump. Even if the answer to this is “this is not he way we intended for the API to be used” that would be helpful, but apart from this just seems like a strange oversight.

        Kasper_Jensen
        Kasper_Jensen
        February 7, 2022

        +1

        I will also be very happy when there is an API endpoint to get the styles and typography properties. E.G. with the ability to define a style format like “CSS”, “JSON”, “RESX” etc.

        I our case it is the styles in a library that we need to extract.
        image

        The solution Nuna_Ferreira mentions requires the style to be use on a node to extract the style information and makes for unnecessary API calls and “jumping” in the JSON tree.

        Maddy_Kim
        Maddy_Kim
        September 8, 2022

        This should certainly be offered natively and such a request (single endpoint) to extract styles in json/etc format seems completely doable.

        Steve_Mato
        Steve_Mato
        September 8, 2022

        Ya… I just requested if this is available of a support contact I was given. I have zero hope tho that this is available directly, in ‘computed style format’, via the API.

        I had to build a significant piece of code to do this using JSONPath-plus. Tho truth be told the ‘significant’ part of it is because I’m doing it within a Chrome extension, which has significant restrictions on what can be done where and how: requiring some of the logic done in the main extension javascript, some to be performed within an injected content javascript, and some of the logic done within a sandbox html file’s javascript.

        Show more replies
        Terms & ConditionsAccessibility statement