No code tools have grown in popularity over the last few years. These tools are perfect for anyone who doesn’t know how to code and doesn’t really want to know how things work under the hood, and prefer to focus on the design, content and interactions themselves.
For Figma users, this no code concept is also carried over to the Figma plugins space, where common design tasks can be augmented with computer automation to take care of the code, and allow the design process to take priority.
Some of the best no code plugins for Figma help automate the most common, frustrating and manual development tasks; from emails to banners, and favicons to content. Here are a few no code Figma plugins that you can get started with today:
Emailify for Figma
Easily design and export responsive, production ready HTML emails (eDMs) using Figma.
One of the more painful experiences for developers is building HTML emails with messy tables and code and that looks like it has travelled through time from 1997.
The Emailify Figma plugin lets you design and export responsive, production ready HTML emails automatically from Figma.
Dozens of modules with one click
Emailify lets you quickly build out a design by instantly adding modules to your email with one click, then add your own styles and content using Figma.
Override responsive design styles for mobile
Easily add mobile overrides and HTML properties (links, alt text etc) to a selected layer to avoid manually adding CSS and HTML in code.
Automatically export responsive HTML emails from Figma
No coding required. Export your email designs from Figma to production ready, responsive HTML email code in seconds using Emailify, with one click.
Includes developer friendly MJML source code files
If your developers easily want to make their own updates to the exported code, the Emailify plugin also exports MJML files for total code customisation.
Bannerify for Figma
Animate and export production ready banners from Figma to HTML, GIFs and Videos, in seconds.
One of the most dreaded tasks for any developer is taking a Figma file containing dozens of banner designs and having to painstakingly build HTML banners from them. If you hate manually creating banners and want to feel like Keanu Reeves in The Matrix; this Figma plugin is for you.
The Bannerify Figma plugin automatically exports animated banners from Figma to production ready HTML, GIFs or MP4/WebM video files from Figma designs with one click. The real-time preview in the Figma plugin allows you to instantly
Easily add animations to Figma layers
Bannerify comes with a bunch of animation presets for the most common enter/exit keyframe transitions that you can apply to the layers in your banner designs. Everything from fades, slides, rotations, transforms and more advanced animations are included to use without any manual keyframe creation required.
Export Figma designs to production ready HTML
Once you’ve animated all of your banners, you can easily export them to HTML with one click. Bannerify supports exporting to HTML/CSS, GSAP, HTML Canvas, DoubleClick, Google Ads and many other ad servers. All of the clicktags and scripts are automatically included, so you don’t need to write any code at all.
Export Figma designs to production ready GIF or MP4/WebM video
If you’re going to be using your banners on a social platform or somewhere else that doesn’t require HTML banners, you can also export your animated banners from Figma to GIF or MP4/WebM video with one click using the Bannerify Figma plugin.
Automatic preview pages with all of your exported banners
If you want to review all of your exported banners at once, Bannerify automatically includes a preview HTML page that you can open or share with your clients/stakeholders. You can also optionally add your own HTML/CSS to inject your own branding or colour scheme, directly from the plugin.
Favvy for Figma
Export production ready favicons (with code) for your website or PWA from Figma in seconds.
Usually forgotten about until the last minute before going live, creating favicons has always been a really weird and annoying process for developers.
The Favvy Figma plugin automatically exports production ready favicons from Figma for your website or PWA (progressive web app) in seconds, with one click.
Preview your favicons in Figma
Favvy works by using any square “frame” layer that you select in Figma and turning it into a production ready favicon package. You can easily preview what the favicon will look like in multiple sizes by clicking on the layer in Figma, and seeing the preview instantly update in the Favvy Figma plugin.
Automatically generate production ready favicons
Favvy gives you all of the files that you need to deploy your favicon to a production website, including all of the .png and .ico image files, plus a .browserconfig and site.webmanifest for progressive web apps (PWA).
Exports HTML snippets for the head tag
Favvy also generates all of the HTML code for your <head> tag, which is automatically pre-populated to link to all of the other files in your favicon package.
CopyDoc for Figma
Update Figma text via CSV/JSON, download Figma comments, and export Microsoft Word docs.
The CopyDoc Figma plugin allows you to import and export text content from your Figma designs. If you’re a developer who needs to extract text content or comments to JSON files; this Figma plugin is for you.
Export your Figma text layers to JSON
As a developer, manually extracting text content from a Figma design can be pretty painful.
CopyDoc allows you to export every text layer in your frames to a JSON file, which gives you a complete overview of your content, and allows you to write scripts that can make use of the JSON data for your websites or other applications.
Re-import Figma text updates from JSON
You can also re-import the JSON file back into Figma if needed. This means you can run a script or manually update the text in your JSON file, and re-import and update those text layers back into your Figma design using the CopyDoc plugin.
CopyDoc will find any text updates by comparing your JSON file and the text layers in the Figma design, then show you all of the differences for review and approval before any text updates are made. Once you’ve selected the updates you want to import, you can update the selected text layers in Figma with a single click.
Export Figma comments to JSON
If you’re collaborating with a design team, and comments are being left inside the Figma file, sometimes it can be difficult to keep track of all the feedback being left on each frame.
CopyDoc has a feature that lets you to quickly export every comment from your Figma file into a JSON with one click; this lets you easily use that JSON data containing all the comments for your own applications or scripts.
