1 of 1

Getting started

A 5min guide on collecting and pulling your first design tokens and assets with Specify.

Introduction

In this guide you’ll learn how to pull your first design tokens and assets to CSS Custom Properties using the Specify CLI.

This guide helps you to sync tokens from Figma local styles and frames to Specify. Want to sync Figma Variables instead? Click here to learn more.

To get the most out of this guide, you’ll need:

Install @specifyapp/cli via npm or Yarn.

npm install -g @specifyapp/cli

yarn global add @specifyapp/cli

Create a configuration file for your desired output format using one of our templates ↗️

specify init

Add your Specify repository from which you want to pull your design tokens and assets. Learn more ↗.

module.exports = {
  repository: '@workspace/repository',
  personalAccessToken: '<your-personal-access-token>',
  rules: [],
};

{
  "repository": "@workspace/repository",
  "personalAccessToken": "<your-personal-access-token>",
  "rules": []
}

Generate a personalAccessToken for the CLI and add it in your configuration.

module.exports = {
  repository: '@workspace/repository',
  personalAccessToken: '<your-personal-access-token>',
  rules: [],
};

{
  "repository": "@workspace/repository",
  "personalAccessToken": "<your-personal-access-token>",
  "rules": []
}

Our configuration is ready and we can now pull our design tokens and assets using the pull command.

specify pull