Solutions

Resources

Solutions

Resources

Solutions

Resources

Specify for developers

Automatically receive design token updates in your codebase

Specify is loved by

Specify is loved by

Specify is loved by

Why use Specify?

Style your components more quickly

Improve the collaboration

Systemise the styling of your applications

Stop manually updating and transforming design tokens and assets into code

Improve shared vocabulary used on your team

Start building high-quality features with less efforts

How can Specify help you?

Continuous Delivery

Continuous Delivery

Continuous Delivery

Reduce tooling, platform maintenance efforts and manual actions. Specify offers you to be in control over the output you need.

Reduce tooling, platform maintenance efforts and manual actions. Specify offers you to be in control over the output you need.

Reduce tooling, platform maintenance efforts and manual actions. Specify offers you to be in control over the output you need.

Specify API

Auto syncing

Repositories as your source of truth

Pull code directly into your git repositories

Tokens

H1

Heading 1

H2

Heading 2

tokens.json

[
  {
    "name": "primary",
    "value": {
      "a": 1,
      "b": 255,
      "g": 189,
      "r": 198
    },
    "type": "color"
  },
  {
    "name": "base-space-01",
    "value": {
      "unit": "px",
      "measure": 4
    },
    "type": "measurement"
  },
  {
    "name": "body",
    "value": {
      "font": {
        "id": "69d2d62e-4d62-45d7-b85f-5da2f9f0c0d4",
        "name": "Roboto-Regular",
        "value": {
          "fontFamily": "Roboto",
          "fontWeight": 400,
          "fontPostScriptName": "Roboto-Regular"
        },
        "type": "font"
      },
      "fontSize": {
        "value": {
          "unit": "px",
          "measure": 16
        }
      },
      "textAlign": {
        "vertical": "top",
        "horizontal": "left"
      },
      "lineHeight": {
        "value": {
          "unit": "px",
          "measure": 20
        }
      },
      "fontVariant": ["small-caps"]
    },
    "type": "textStyle"
  }
]

Get started in seconds

Quick implementation and a smooth UX. Specify is flexible and still simple to use.

Quick setup

Configuration templates

Documentation

CLI

tokens.json

{
  "primitive": {
    "spacing": {
      "1": {
        "$type": "dimension",
        "$value": {
          "default": {
            "value": 4,
            "unit": "px"
          }
        }
      },
      "2": {
        "$type": "dimension",
        "$value": {
          "default": {
            "value": 8,
            "unit": "px"
          }
        }
      }
    }
  },
  "themedColor": {
    "$collection": {
      "$modes": [
        "light",
        "dark"
      ]
    },
    "high-emphasis": {
      "$type": "color",
      "$value": {
        "light": {
          "model": "hex",
          "hex": "#262626",
          "alpha": 1
        },
        "dark": {
          "model": "hex",
          "hex": "#ffffff",
          "alpha": 1
        }
      }
    }
  }
}

Input

CSS

Tailwind

React Native

/* tokens.css */
:root {
  --primitive-spacing-1: 4px;
  --primitive-spacing-2: 8px;
}
[data-theme="light"] {
  --high-emphasis: #262626;
}
[data-theme="dark"] {
  --high-emphasis: #ffffff;
}

Output

Customize output

Customize output

Customize output

Our SDK, CLI and parsers make it easy for you to transform the data structure, organization and output formats of all design tokens synced through Specify

Our SDK, CLI and parsers make it easy for you to transform the data structure, organization and output formats of all design tokens synced through Specify

Our SDK, CLI and parsers make it easy for you to transform the data structure, organization and output formats of all design tokens synced through Specify

CSS Custom Properties

Tailwind

Style Dictionnary

Icons as JSX components

and many others parsers…

Integrated in your daily tool

Integrated in your daily tool

Integrated in your daily tool

Specify easily connects to your git repositories. Our native integrations and our CLI help you use Specify from anywhere you want.

Specify easily connects to your git repositories. Our native integrations and our CLI help you use Specify from anywhere you want.

Specify easily connects to your git repositories. Our native integrations and our CLI help you use Specify from anywhere you want.

GitHub

GitLab

Azure DevOps

Bitbucket

SDK

$

CLI

  • Integrated apps

    Roy Van Rooijen

    Product designer

    "The automation from design to code with Specify is incredibly powerful. The ability to reference the same tokens and assets in Figma — and in our codebase — saves us an incredible amount of time, while reducing manual, error-prone work.”

  • Integrated apps

    Romain

    Developer

    "QA used to take a lot of time between deploying in different environments, checking names and values, and deploying in production. Now we can use this time for other tasks with more business value and are more enjoyable."

  • Integrated apps

    Alexis Oney

    Lead Frontend Developer

    "Configuring a new project used to take a whole day. Now it's a 1 or 2 hour process. From now on, we start all our new projects with Specify which gives our team more time to focus on what really matters: specific work for our clients."

  • "The automation from design to code with Specify is incredibly powerful. The ability to reference the same tokens and assets in Figma — and in our codebase — saves us an incredible amount of time, while reducing manual, error-prone work.”

    Roy Van Rooijen

    Product designer

  • "Specify brought us confidence and ease of mind. Before, we used to be cautious and hesitant before updating our design tokens. We're now confident about updating a token, rolling back to a previous version, or even trying new ones."

    Romain

    Developer

  • "Configuring a new project used to take a whole day. Now it's a 1 or 2 hour process. From now on, we start all our new projects with Specify which gives our team more time to focus on what really matters: specific work for our clients."

    Alexis Oney

    Lead Frontend Developer

  • Integrated apps

    Roy Van Rooijen

    Product designer

    "The automation from design to code with Specify is incredibly powerful. The ability to reference the same tokens and assets in Figma — and in our codebase — saves us an incredible amount of time, while reducing manual, error-prone work.”

  • Integrated apps

    Romain

    Developer

    "QA used to take a lot of time between deploying in different environments, checking names and values, and deploying in production. Now we can use this time for other tasks with more business value and are more enjoyable."

  • Integrated apps

    Alexis Oney

    Lead Frontend Developer

    "Configuring a new project used to take a whole day. Now it's a 1 or 2 hour process. From now on, we start all our new projects with Specify which gives our team more time to focus on what really matters: specific work for our clients."