Plugins

Cool plugin for arranging objects in different types of layouts, like radial (full circle or arc), along a custom vector path, packing an area with objects, etc. Great tool for to building radial menus, watch faces, HUD display graphics, particle effects, backgrounds, and interesting patterns.

Export icons from Figma straight to React, Vue, or Svelte components.

Rad product and home page! ​“ShaderGradient is a design tool to create beautiful moving gradients. Make stunning visuals by adding natural movements and effects to the gradient. It’s available on your favorite tools, like Framer, Figma, and React.”

New plugin for working with perceptual color and OKLCH color space! This initial release allows inspecting and manipulating color stops in gradients using the OKLCH color space — pretty useful if you have an existing gradient that needs a little tweaking. Bonus point for providing precise control over color stop positions!

An early beta of a new APCA contrast checker plugin from my friends at Evil Martians. Polychrom displays the contrast level between the selection and an automatically detected layer background or two selected layers with solid fills. It also offers text size recommendations for regular and bold font styles, following the APCA contrast-to-font table. Earlier this year I was looking for an APCA contrast checker to recommend in my Config talk and found all existing options lacking, so really happy to see this team building it!

Select two vector shapes and specify how many steps to create between them.

I’ve been using it for years but never shared it before! Great for putting any objects or text on a path.

This plugin made my head spin: ​“Make procedural geometry, generate dynamic text, design color systems with logic and mathematical precision. Explore endless variations, and automate things that would be too tedious or even impossible to do by hand.”

Zen Keys is a new plugin from Corey Lee that extends the Quick Actions menu to provide more keyboard accessibility for Figma features that don’t have dedicated shortcuts. Spend less time reaching for your mouse and lean into Figma zen mode with keyboard actions. (Something is cooking with the Quick Action bar, isn’t it?)

Jambot is a free widget from Figma to interact with ChatGPT right in FigJam. Use it to create visual mindmaps, take a multi-threaded approach to brainstorming, or generate ideas with teammates and ChatGPT on the same canvas. Quite amazing that it was born during last month’s Maker Week and is already live!

During Maker Week, Rogie built a handy plugin for attaching files to the Figma document for hand-off. Great tool for sharing fonts, high-resolution pictures, or other assets with developers.

A preview of the design lint plugin for identifying and fixing issues like missing tokens or styles.

Use Stable Diffusion to create unique AI images for your designs without ever leaving Figma with this text-to-image plugin. Won the ​“3rd Product of the Day” at ProductHunt on August 1st.

A new plugin from the Tokens Studio: ​“Already have your variables set up and want to bulk apply them to your work? You can swap styles with variables or apply variables that match raw number values to elements in any file with access to your variables collections!” See also the walkthrough video.

I shared a sneak peek of this plugin by Yi Shen in issue #123, and now it’s available in the Community: ​“This plugin converts text and vector nodes into 3D models with just one click! The converted models will be automatically placed and rendered with GPU ray-tracing. You can use it to render a nice 3D icon, text, or any other 3D-style images without being a 3D specialist.”

Codejet converts designs to production-ready code. Create a project in Figma, and Codejet will convert it into React and TypeScript code. Was voted Product Hunt’s Product of the Day on July 13th.

A new plugin by Jan Toman: ​“Export variables from one file and import them to another. It’s great for migrating libraries, or when you downloaded a library from the community and you’d like to import variables to your existing design system.”

“Figlet is a sandbox-like environment with a built-in editor that allows you to play with and learn how to use the Figma developer platform right inside Figma.” It’s made by Gavin McFarland, author of the popular Table Creator plugin, and funded by Figma Creator Fund.

Find Variables plugin by Daniel Destefanis helps you find what variables are being used in your file and easily select the layers using them.

A few new plugins for converting styles to variables came out last week, and I’m still trying to pick a favorite. The best part of Styles to Variables Converter is that after creating variables it updates existing styles to use them, so if you delete or detach styles objects will fall back to variables. A slightly more popular Styles to Variables plugin doesn’t seem to do this yet. I also wish these plugins let me map styles to existing variables, or at least specify a target collection.