Export Design Tokens | Zeplin Help Center

If your Styleguide already has colors, text styles, and spacing tokens published in Zeplin, select the "Export Design Tokens" button from your styleguide to download a .zip package or copy the tokens to your clipboard.

Copying your Design Tokens to the Clipboard

You'll be asked to Fetch the Design Tokens through the API or download a .zip package. If you would like to copy the design tokens to your clipboard, you can select "Fetch."

Here is an example of the color tokens that are generated:

{
  "colors": {
    "teflon": {
      "value": "rgb(85, 77, 86)",
      "metadata": {
        "source": {
          "styleguide": {
            "id": "5edfc867c72a9397fffcd55c",
            "name": "Web Core",
            "platform": "base"
          }
        },
        "resource": {
          "id": "5edfc8b3b1d4aa97af11e195",
          "type": "Color"
        }
      }
    },
    "gandalf": {
      "value": "rgb(151, 145, 151)",
      "metadata": {
        "source": {
          "styleguide": {
            "id": "5edfc867c72a9397fffcd55c",
            "name": "Web Core",
            "platform": "base"
          }
        },
        "resource": {
          "id": "5edfc8b3c70db0b830b4cdce",
          "type": "Color"
        }
      }
    },
    "sweet-pink": {
      "value": "rgb(255, 174, 179)",
      "metadata": {
        "source": {
          "styleguide": {
            "id": "5edfc867c72a9397fffcd55c",
            "name": "Web Core",
            "platform": "base"
          }
        },
        "resource": {
          "id": "5edfc8b3c70db0b830b4cdcf",
          "type": "Color"
        }
      }
    },

Download design tokens as a .zip package

You can also download individual JSON files of your color, text style, and spacing tokens by selecting "Download" from

Related Articles: