Skip to content
This repository has been archived by the owner. It is now read-only.
master
Switch branches/tags
Code

Latest commit

 

Git stats

Files

Permalink
Failed to load latest commit information.
Type
Name
Latest commit message
Commit time
 
 
 
 
 
 
 
 
src
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

DesignToken2Code

DesignToken2Code is a Sketch Plugin that converts shapes color using as design token to code such as scss variables.

This plugin was created using skpm. For a detailed explanation on how things work, checkout the skpm Readme.

image

Why?

I want a workflow that make easy to maintain relation between design and code.

More detail (in Japanese): https://note.mu/yoshizukin/n/n7c48af8cdbee

Installation

  • Download
  • Install with Sketch Runner
    With Sketch Runner, just go to the install command and search for DesignToken2Code. Runner allows you to manage plugins and do much more to speed up your workflow in Sketch. Download Runner here.

Usage

  1. Add artboard and name Tokens.
  2. Add shapes in Tokens Artboard.
  3. Rename shapes $color-xxx.(xxx is specific words which you need)
  4. Run DesignToken2Code command.

📦 Sample data

Development

See development.md.

LICENSE

MIT

About

Convert design tokens to SCSS variables as code

Topics

Resources

License

Packages

No packages published