SCSS Variables Generator
Generate a full SCSS color variable scale from one brand color. Everything is generated live in your browser — copy or download when it looks right.
Shortcuts: / search · R randomize · T theme
Frequently asked questions
What does the scss variables generator produce?
Generate a full SCSS color variable scale from one brand color. The generated code follows current best practices and works in all modern browsers.
Can I use the generated code commercially?
Yes — everything Yexla generates is yours to use freely in personal and commercial projects, no attribution required.
Does it support dark mode?
The generated variables work in any theme; pair them with a prefers-color-scheme media query or a data-theme attribute to switch palettes.