UX Hero: Code Runner

About this plugin

UX Hero: Code RunnerRun any Figma Plugin API code directly in Figma — no terminal, no setup, no switching apps.Write a script, hit ⌘Enter, see it reshape your file in seconds. The fastest way to automate design work, generate components, and ship design system operations at scale.———🎓 КУРС: ДИЗАЙН-СИСТЕМА + AIХочеш навчитись будувати DS з нуля + автоматизувати рутину через AI та Figma API?→ uxhero.design/ds-ai-course🇺🇦 UA DESIGNERS COMMUNITY — UX HeroПриєднуйся до українського дизайн-ком'юніті: розбори, живі сесії, шаблони, інсайти.→ t.me/ux_hero▶ YOUTUBEТуторіали по Figma, DS, AI-автоматизації та плагінам.→ youtube.com/@ux-hero———✦ WHAT IT DOES• Live code editor with JS syntax highlighting + line numbers• Executes any Figma Plugin API code via ⌘Enter or the Run button• Pre-loaded DS helpers: makeFrame(), makeText(), makeRect(), makeComponent(), glassFills(), solid(), combineVariants()• Built-in DS tokens: accent, bg, textPrimary, textSecondary, error, borderDefault…• Console panel captures console.log / warn / error with timestamps and elapsed time• 7 ready-to-use snippets: Button, Input Field, Card, Badge, Avatar, Toast, Color Palette• Resizable editor / console split — drag the handle• ⓘ How to Use → full docs with examples✦ WHO IT'S FORDesigners who know (or want to learn) JavaScript. Design engineers. Anyone building or maintaining a design system in Figma who's tired of clicking the same operations manually.✦ HOW TO USE1. Open Code Runner in any Figma file2. Pick a snippet from the bar to try it instantly — no code needed to start3. Hit ▶ Run (or ⌘+Enter)4. Watch it happen on canvasWant to write your own? All Figma Plugin API globals are available. Use the snippets as a starting point.———Free. Made with love in Ukraine 🇺🇦By Dmytro Nikolaienko · uxhero.design