Orange Tokens: Primitive Variables Generator

About this plugin

Description

Orange Tokens helps you turn any base color into a full set of tints and shades — instantly and intelligently. Whether you’re starting a new design system or refining an existing one, this plugin makes it easy to generate consistent, customizable color variables in Figma.

No more manual tweaks or guesswork — Orange Tokens helps you scale your colors the smart way.

🚀 How to use

1. Enter your base colors and give them names
2. Press “Generate Variables”
3. Orange Tokens generates variables with tints, shades, and smart naming
4. Use the generated palette directly as design tokens, or tweak and reuse them across your system.

✨ Features

1. One-click color palette generation
2. Auto-generated tints & shades from base colors
3. Design token–friendly naming system
4. Organized Figma variables by base name
5. Great for light/dark mode, theming, and token systems
6. Fast, clean, and easy to use — even at scale

⚙️ How it works

Orange Tokens applies a structured algorithm to your base hex values, producing harmonious tints and shades. Each palette is mapped to a name you provide (like green, orange, blue) and creates a set of Figma variables grouped logically — perfect for scaling your system with consistency.

Everything happens in a few clicks, without breaking your existing styles or variables.

💬 Feedback and feature ideas?

This is just the beginning — future updates will explore typography tokens, spacing, mode support, and more. Have an idea or request? Email me at [email protected], or leave a comment on the plugin page!