Colors Manager

Import, Export and Update Sketch Color Variables to and from Color Tokens.

A few things you can do:

• Export all the local Color Variables defined in a Document;
  
• Update HEX values for any of the Color Variables (i.e. change theme for the whole Document);
  
• Copy all (or just some) Color Variables from one Document, then paste them into another Document;
  
• Import HEX color values (with or without names) as Color Variables in Sketch;
  i.e. Import color scales from tools like hue.tools

👉 Download the latest version of the plugin here

Examples:

Color Name and HEX Value pairs (with or without opacity)

Primary-50: #f1a4c6ff;
Primary-100: #ed8bb7ff;
Primary-200: #e972a8ff;
Primary-300: #e65998ff;
Primary-400: #e24089ff;
Primary-500: #de2779ff;
Primary-600: #ca1f6cff;
Primary-700: #b11b5eff;
Primary-800: #981751ff;
Primary-900: #7f1344ff;

💡 Want to group Color Variables? Add Group-Name/ before the Color Name i.e. Group-Name/Primary-50: #f1a4c6ff;

Color HEX Values only

#ff008c
#de2779
#be3469
#9e3a5a
#7e3c4d
#5f3b42

💡 You will be prompted to add a base name like $primary-color- and each value will be assigned $primary-color-1; $primary-color-2; $primary-color-3;.... If you omit the base name, the HEX values will be used to create the Color Variables names.

Created by

Francesco Bertocci 👉 @fbmore