Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
Loading...
We provide the first Design Data Platform allowing you to send your design tokens and assets across your design system tools. Specify is built with this idea: configure once, synchronize anytime.
Specify is a central and tool-agnostic platform. It means you can integrate your daily applications to collect, store and distribute your design decisions to the right teams, in the right format, at the right time. To sum things up, see Specify as the synchronization layer for your design data at the heart of your design system.
Designers, connect your favorite design tool, like Figma, and let Specify monitor and collect your design tokens and assets automatically. This way, you control what is sent to developers and reduce the risk of inconsistencies.
Teams can benefit from a single source of truth and a continuous delivery system that ensures brand consistency.
In short, you have more time to focus on what matters most: your products and your end-users.
A 5min guide on collecting and pulling your first design tokens and assets with Specify.
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:
A Specify account
A Specify repository containing some design tokens and assets (Learn more ↗)
Install @specifyapp/cli
via npm or Yarn.
Create a configuration file for your desired output format using one of our templates ↗️
Add your Specify repository
from which you want to pull your design tokens and assets. Learn more ↗.
Generate a personalAccessToken
for the CLI and add it in your configuration.
Our configuration is ready and we can now pull our design tokens and assets using the pull
command.
In this guide, you’ll learn how to sync your Figma Variables and/or Styles to a Specify Repository and how to keep them updated.
To get the most out of this guide, you will need:
A Specify Account
A Figma file containing Variables and/or Styles
Access your Figma file which includes the Variables and/or Styles you would like to sync to Specify
Download ↗ the Specify Widget in the Figma file which includes your Variables and/or Styles. Or update the widget if you already have it. To update the Specify Widget you have to disconnect it, remove the entire frame in all of your Figma files, and reopen the latest version of the Widget.
Follow the steps in the widget to connect your account. You will need to create a personal access token and you will need to add the link to the Figma file to which the widget is added. Watch tutorial ↗
Click "Connect"
Choose Advanced Repository
Note: the widget can be used for syncing Figma Styles from the Classic repositories as well, you can switch between the two by clicking "Switch to".
Go to your Specify workspace
Click on "Create repository"
Choose a name
Select "Advanced Repository" (Learn more ↗︎)
Click "Create repository"
Go back to your Figma file that includes the Variables and/or Styles
Click on "Create Source" in the Specify Widget
It will show you the local collections and styles that are detected
Select the design tokens format you want to collect from your Figma file. Learn More ↗︎
Select the Specify repository you want to sync with. You should be able to see the Repository you have just created in Specify (if not, reload the list).
Click "Save to Specify"
You will immediately see the repository listed with the latest syncing time
Make sure to understand that only Advanced repositories are listed here.
Use the Sync
button to update your Variables and/or Styles with Specify. Now you are ready to export your design tokens! 🎉
You will see the category of design tokens that are synced on the left-hand side
In the Sources
section (left-hand menu), you will see your connection(s) and when the last sync between your Figma file and Specify repository has occurred.
Delete your source by clicking on the 3 dots option menu in the source card.
Welcome to the Specify docs! Learn about how to use and integrate Specify in your workflow to sync your design tokens and assets in your design system.