The 15 best Figma plugins for designers (so far)

Deep Joshi (Product Designer)

Aug 9 · 6 min read

When I saw the Figma Plugin launch event, I completely feel grateful for the Figma design team and Figma growing insanely great as an amazing collaborative platform for the designers so after that I stared explore the plugin area and I built my own list of plugins and these plugins made my design workflow faster and better. I just love that and I wanted to share with you so you can make your workflow faster and design better interface and experience.

  1. Autoflow

Autoflow makes it easy to draw flows. Simply select 2 objects, hit a hotkey, and a line will be magically drawn between them.

To use 1. Select 2 objects 2. Right-click, find Autoflow in Plugin menu 3. Wire up all your screens by hitting ⌥⌘P to run the last plugin

2.Able — Friction-free accessibility

We made Able to help designers add accessibility to their workflow with as little effort as possible. Open the plugin and Able will automatically compare the contrast between the two layers you select. This way, you can keep Able open, and casually select layers to compare without re-running or updating the plugin!

3. Remove BG

Remove the background of images automatically with just a single click — using the remove.bg API. Note: You will need a remove.bg account for this plugin.

4.Figmotion

Figmotion is an animation tool built right in Figma. This makes the entry into animation easier and more convenient as there is no need to switch to a completely separate motion tool such as Principle, Haiku or After Effects. Figmotion makes the animation hand-off to developers more manageable as well as it is built with web technologies in mind.

5.Isometric

isometric allows you to create isometric layers without manually having to set them up. How to Use Isometric: 1. Choose Your Layer 2. Right Click > Isometric 3. Select Your Perspective This project is open source and MIT licensed.

6. Content Reel

Need content for your layouts? Content Reel helps you easily pull text strings, avatars and icons into your designs. First, select one or more layers in your design file, then choose from the Content Reel palette to apply.

7.Rename It

Keep your Figma files organized, batch rename layers and frames.

7.Color Palettes

Find the best color palette from the huge list of best color palettes Fill beautiful color from “Color Palettes plugin” straight into your design. With Color Palettes for Figma, you can search for your favorite color code, palette number or name that you remember from Color Palettes plugin and apply it on your design and make it awesome

8.Component Cloner

Ever wanted to iterate upon an idea made with components without messing with existing ones and copy variations between its instances? With component cloner, you can select component instances you want to copy and they’ll be assigned to a new copy of their original master component. You can also just make a clone of a component.

9.Unsplash

Insert beautiful images from Unsplash straight into your designs. With Unsplash for Figma, you can insert a random image or search for something specific. The Unsplash License allows images to be used freely for both commercial and personal projects.

10.Brands Colors

Find the best color from the world’s best brands and cool apps Fill beautiful colors from “Brands Colors plugin” straight into your design. With Brands Colors for Figma, you can search for your favorite brand’s colors or app’s colors and apply it on your design and make it awesome

11.Datavizer

Create a bar chart, scatter plot, or line chart easily with your own data! Or use a random set of data to quickly create shapes or dummy data (for example, sparklines for a dashboard mockup). When you upload your own data (CSV or JSON file), we’ll grab any numeric keys and allow you to choose one for each relevant dimensions.

12. Icon Resizer

Resize icons into a standard size and bounding box on your design. It’s much easier to work when all your icons are the same size and have a square bounding box. Select one or more frames, and set the icon and bounding box size. That’s it!

13. Image Palette

Extracts a color palette of 5 different colors from the selected images. Note: This uses a median cut algorithm, which roughly approximates the most prominent different colors in the image. The algorithm is fast but can sometimes lead to unusual results, such as with low-color images, images of vector graphics, and so on. The extracted colors may not exactly match the hex codes in the image.

14. Viewports

Make sure that your mobile designs are covering a reasonable share of the market! Select one or more frames and Viewports will let you change their sizes to your preferred device. Simple! Currently supported: Apple iPhones Google devices Next up: Samsung devices Desktop devices

15. Interplay

Interplay connects with your design system code repository to let you access and use your design system code components right within Figma. From the plugin, you can browse code components, edit properties, change content, and drag the configured component onto the Figma canvas. Interplay generates a Figma component on the fly and keeps it connected with the related code component so that your design is always in sync with your production code.

This was my list for now. I am so excited about new cool plugins! Hope you guys find useful 😇

Published
Categorized as UX

Leave a comment

Your email address will not be published.