Before you begin
- Get familiar with our tokens
- Understand the logic
- Get access to our component and VUD tokens
Get read-only access
You are not limited to the components we provide, you can also create your own custom components. You can apply VUD tokens through:
- Figma variables
- Token Studio plugin (Optional).
Get started
- Enable VUD 💠 variables style library to access our VUD tokens
- Enable VUD 💠 components to access our VUD components
Install and run the plugin
- Go to Tokens Studio plugin and click on the button that says "Try it out"
Create a GitHub account
- Go to https://github.com/signup and create an account
- Go to the Personal Access Tokens and generate a personal access token.
-
Choose either Classic or Fine-grained tokens
Classis: Generate a new token and select scope repo.
Fine-grained tokens: Choose the repos for access and make sure Contents has Read and Write selected under "Repository permissions. - Determine the expiration date.
Add a new sync provider
- Open TS plugin
- Click the empty file
- Go to the Settings
- Click on the GitHub
Edit the credentials
- Name: Your choice
- Personal Access Token: Copy and paste your token
- Repository (owner/repo): Visma-Unified-Design/vud-tokens
- Branch: main
- File Path (e.g. tokens.json) or Folder Path (e.g. tokens): Tokens
And you are all set!
Related content
Have a question, comment or idea?
Join our internal Slack channels to share your thoughts!
For design-related topics on VUD
Visit VUD design community
To discuss code-related topics
Join VUD developer community