The 16 Most Useful Figma Plugins You Can Download for Free
Background image byEdge2Edge Mediavia Unsplash. No attribution required.
Figma plugins help increase your work output and ensure you stay within Figma to complete your design work. With Figma’s infinite library of plugins, there’s almost nothing you can’t do with your favorite design tool.
With these most helpful free Figma plugins, we’re only scratching the surface of what’s available.
How to Download Figma Plugins
Before we jump into the list of goods, you should know how to find and download a Figma plugin. You may knowhow to use Figma, but if you don’t, here’s how it’s possible to easily find the plugin library. Some plugins may work better from the Figma desktop app than from the browser version.
Screenshot by Ruby Helyer, Author. No attribution required.
Head to the Community page, which can be found on the homepage or from a file page under your account name. The Community page lists more than just plugins, but from a Figma file, selecting theMain Menu>Pluginswill show you recently used plugins and saved plugins, and lets you find new plugins.
SelectingFind New Pluginstakes you to theResourcestab where you can search for any plugin. Once you find a plugin you want to download—from the Community page—selectTry It Outto download, or—from the Resource search box—selectRunto download the plugin.
Each plugin should provide its own instructions for usage, so read the blurb when prompted.
1.Mesh Gradient
Gautham’s Mesh Gradient plugin provides a quick and easy way to add custom gradients to your Figma designs. Run the plugin and create a gradient square. You can customize the colors yourself or hitRandomizeto auto-generate a gradient design.
This plugin creates an image from your gradient, so it cannot be edited after generating it. However, you can edit old or create new gradients in the plugin.
2.Figma to Webflow
Webflow Labs provide a great way to turn your Figma design into HTML or CSS ready for Webflow and website creation. You can integrate Webflow interactions into your Figma designs for seamless integration with Webflow Labs. This plugin is great if you’re a Webflow Labs user or work with a web dev team.
It includes responsive components, retains all your styles, fonts, and images, and even allows you to edit HTML tags right in Figma. You cancreate master template styles in Figmaand use Figma to Webflow to export them for future website projects.
3.Unsplash
Unsplash’s official Figma plugin means you can insert images directly into your designs without leaving your Figma window. All the same Unsplash licenses are available, but with this plugin, you’ll save time and clicks when adding images to your work.
4.Lorem Ipsum
If you’re a designer of images, you might find it hard to find placeholder text for the space in your designs. The Lorem Ipsum placeholder plugin does it all for you. With traditional Latin text, just hand over your design to your copywriter to turn the placeholder text into the real thing, so all you have to do is focus on the visuals.
5.Text Porter
If you have a copy deck of copywriting needed for your design, Text Porter helps move your copy from Excel to Figma easily. Simply run the Text Porter plugin and move your text over. Then edit the text directly in your Excel file to update your Figma design in the future. This is helpful if your copywriter has no access to or knowledge of Figma.
For a smoother workflow along with using plugins, you can alsouse Figma shortcuts for a faster workflow.
6.Icons8 Background Remover
Removing backgrounds is a common practice when using images in many design aspects. Instead of slaving away on Photoshop, Canva, or other editing programs, using the Icons8 Background Remover plugin speeds up the process and keeps it all in Figma.
The background removal tool can be applied to more than one image at a time, speeding up your work process at the click of a button.
7.Image Tracer
The Image Tracer plugin creates a vector image from whichever images and image layers you choose to apply it to. A scalable vector is like gold dust for digital design work, and this plugin makes easy work of turning any image into a vector.
8.Html.to.design
The Html.to.design plugin can help you recreate existing website designs into Figma designs. This serves many purposes such as helping you practice designing websites, or for you to recover old websites you’ve designed and lost access to.
See our detailed tutorial forconverting a website into a Figma designusing this plugin.
9.Vectorize
The Vectorize plugin works similarly to Image Tracer, but this is better if you only have one image and one color to vectorize. Converting bitmap images to vectors is easy using this plugin.
Your new vectors will be a vector path, easy to edit and use for all your design needs. Especially good if your client sends you their logo as a pixelized image copied from a Word document. it’s possible to easily revive logos and other one-color icons in Figma.
Canva and Figma are both popular with designers, but which is the best option for you?
Your phone is a better editor than you give it credit for.
Tor spoiled me forever.
Don’t let aging hardware force you into buying expensive upgrades.
Your phone’s camera app doesn’t show this, so it’s easy to miss.
Lose your laptop without this feature, and you’ll wish you had turned it on.
