Specify for developers
Specify for developers
Specify for developers
Specify for developers
Automatically receive design token updates in your codebase
Automatically receive design token updates in your codebase
Automatically receive design token updates in your codebase
Automatically receive design token updates in your codebase
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
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.”
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."
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."
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.”
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."
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."
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.”
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."
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."
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.”
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."
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
"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
"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
"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
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.”
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."
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."
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.”
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."
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."
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.”
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."
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."
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.”
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."
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."