DRP Palette Importer

About this plugin

Stop saving files just to import colors into Figma.You generate a Tailwind palette or any custom palette from an online tool, get the code output — then have to save it as a file and upload it into a plugin. Every project, same friction. If you work design-first, your colors need to be in Figma before they ever hit code.DRP Palette Importer cuts that down to paste, preview, import.HOW IT WORKSPaste your color code directly into the pluginIt auto-detects the format and extracts every colorPreview all colors before importingHit import — organized Figma local variables, doneSUPPORTED FORMATS• Tailwind config color objects (colors: { primary: { 50: '#f0f9ff', ... } })• Any JavaScript/JSON color objects (design tokens, custom palettes, key-value pairs)• CSS custom properties (--color-primary-500: #3b82f6;)• HEX, RGB, HSL, and OKLCH color valuesFEATURES• Auto-detect JavaScript/JSON and CSS formats• Preview grid with toggleable HEX, HSL, and OKLCH display• Organized palette/shade variable naming (e.g., primary/500)• Color format descriptions saved to each variable• Overwrite detection — update your palette and re-import without duplicates• Conflict checking before importing• Custom collection namingPERFECT FOR• Design-first workflows — get your palette into Figma before writing code• Developers syncing Tailwind configs or design tokens to Figma• Design system teams keeping code and Figma variables in sync• Anyone tired of manually creating color variables one by oneNo file saving. No uploads. No reformatting. Just paste and go.Made by Dixie Raiz Pacheco