Variables Generator

About this plugin

Automate creating local variables by using JSON and speed up your workflow. Simply use the formats below to generate your variables, colors must be in a hex format and can support alpha channels via 8 digits.⚠️ NOTE: This plugin only supports color variables, future updates may eventually support all variable types.DemoView this video demo of the plugin working with aliasing.Single Mode{"VariableName": "Hex","VariableName": "Hex"}Multiple Modes{"VariableName": {"Mode": "Hex","Mode": "Hex"},"VariableName": {"Mode": "Hex","Mode": "Hex"}}AliasingYou can use aliasing across your local variables as long as their names are unique.{"VariableName": "$VariableAlias","VariableName": "$VariableAlias","VariableName": "$VariableAlias"}VariableName is the name of your variable$VariableAlias is the name of the alias you are aliasing, be sure to include the $ to enable aliasingMode is the name of your mode, each variable must contain the same modesHex is the hex code of your color, supports 8-digit hex codes for transparencyExamplesSingle mode that creates a color palette:{"black": "#0e1112","white": "#d4d7d6","grey": "#4d5a5e","blue": "#519aba","green": "#8dc149","orange": "#e37933","pink": "#f55385","purple": "#a074c4","red": "#cc3e44","steel": "#7494a3","yellow": "#cbcb41"}Multiple modes that use 8-digit hex codes:{"tab-activeBackground": {"Dark": "#1f1f1f","Light": "#ffffff","Monokai": "#272822"},"tab-activeBorder": {"Dark": "#1f1f1f","Light": "#f8f8f8","Monokai": "#00000000"},"tab-activeBorderTop": {"Dark": "#0078d4","Light": "#005fb8","Monokai": "#00000000"},"tab-activeForeground": {"Dark": "#ffffff","Light": "#3b3b3b","Monokai": "#ffffff"},"tab-border": {"Dark": "#2b2b2b","Light": "#e5e5e5","Monokai": "#1e1f1c"}}Using aliasing across collections:Colors collection:{"black": "#0e1112","white": "#d4d7d6","grey": "#4d5a5e"}Tokens collection that references Colors variables:{"button": {"Dark": "$black","Light": "$white","Monokai": "$grey"}}