Figma Plugins and Tools to Boost your Design Workflow

Figma is an excellent tool for designing interfaces, and the one of the best things about it is the enormous community behind it, providing a continuous flow of great resources such as templates, icons, tools and plugins that make your design workflow faster and easier.

Figma has a lot of advantages compared to Adobe XD or Sketch. It’s a browser-based interface design tool that is cross-platform and works in any browser and OS, providing the ideal environment for real-time collaboration with other designers and team members. Apart from its collaborative functionalities and its capacity to create interactive prototypes, export code, graphics and complete layouts, with the help of plugins, Figma can extend its features further – such as the automation of time-consuming tasks.

New Figma resources are uploaded daily to the Figma Community and to save you time, we’ve made a useful list of the best plugins and tools to speed up your design workflow, based on our first-hand experience.

A list of 20 must-have Figma Plugins and Tools

To install a Figma plugin, simply explore the wide range of resources on the Community page and click “install” to add the plugin to your user account. Where you can find new apps with great ideas to help your creative process.

ANIMA

Create high-fidelity prototypes inside Sketch, Adobe XD, and Figma and export HTML & CSS in a single click.

FRAMER

A JavaScript framework tool where you can import Figma files easily and create realistic prototypes with filters, spring physics, and 3D effects.

CHART

Create useful charts using real or random data by copy-pasting files from editors like Excel, Numbers, and live Google Sheets. Chart supports remote JSON (REST API), local CSV and JSON files

MOTION

An animation tool to help you bring your designs to life. Make interactions in UI, animate elements, characters and more.

OMNICHART

A great tool to make your own customizable UX Flow Charts, each component is separate so you can edit and rearrange as you see fit.

BRAVO

Turn your Figma design prototype into a real native iOS and Android mobile app. No code needed.

BLUSH

Create and customize ready-made illustrations inside your Figma design project.

LOTTIE FILES

A library containing 1000s of free Lottie animations. Drag and drop your dotLottie (.lottie) and Lottie JSON (.json) files, insert Lotties as GIF animations, and insert animation frames as high quality SVGs.

DYNAMIC DATA

Easily connect data files (e.g excel files) with open projects in Figma, allowing the data to be automatically imported to the Figma file and preparing as many layers as needed.

BERAKPOINTS

A preview for responsive design layouts inside a Figma frame, it’s suitable for Web, Android, iOS/iPadOS, and can be used without even opening the plugin window.

HTML<>FIGMA

Easily convert Figma designs to HTML, CSS, React Vue, and more.

COLOR PALETTES

Search for your favorite color code, palette number and apply it to your design.

BANNERIFY

For those who are tired of manually coding banners, this plugin allows you to export ready-animated banners from Figma to HTML, GIFs, and Videos.

CODA

Design with data from docs and apps such as Spotify, Wikipedia, Intercom etc. Create a table in Coda, connect your design to the table and watch it fill up with real data.

FIGMOJI

😉 Want to use emojis in your projects? Make your selection from the library and Figmoji adds the svg of the selected emoji to your design.

FIGMOTION

Take your animations to the next level. This tool is built right in Figma, so you save a lot of time by not using separate programs.

VECTARY 3D

Insert your 2D designs directly into Figma as 3D mockups or other 3D designs, all with one click.
Source: https://www.awwwards.com/20-figma-plugins-and-tools-to-boost-your-design-workflow.html