Back to Plugins
Color fills to Variables

Color fills to Variables

Automate the variables creation of your color scales

Plugin Preview

Color fills to Variables preview

About this plugin

Color fills → VariablesTurn the colors used in your designs into Figma Color Variables in just a few steps.This plugin lets you capture solid fill colors from selected layers, review how they’re used, and create color variables with consistent naming and grouping, without manual copy-paste or risky overwrites.What it doesCaptures unique SOLID fill colors from selected layersShows usage count per color and sorts them by luminanceLets you review and edit variable names before creationOptionally generates structured names using a prefix and steps (50 / 100)Groups variables automatically using Figma’s slash notationSafely handles existing variables with optional overwrite controlWhy it’s usefulQuickly migrate existing designs to Figma VariablesBootstrap or extend a color system from real UI usageReduce naming errors and duplicated variablesKeep your Variables panel clean and organizedHow it worksSelect one or more layersClick Capture colorsReview and optionally customize namesCreate color variablesDesigned for designers working with design systems, tokens, and scalable UI foundations.

Plugin Details

Version1
CreatedJanuary 22, 2026
Last UpdatedFebruary 6, 2026
CategoryFile organization plugins
CreatorRegalado Montoya
Stats6 installs, 0 likes
PricingFree

Technical Details

  • API:1.0.0
  • UI:ui.html
  • main:code.js
  • Document Access:dynamic-page
  • Editor Types:
    figma
  • Allowed Domains:
    • none