Plugins

“An AI assistant that does the boring stuff for you. MATE supports you in your small boring tasks, allowing you to focus on the not boring things. Ask it to rearrange elements, create a color palette, change the stroke for hundreds of items, apply random opacity to selected items, rename variables, and much more.” Watch the demo.

Easily create flexible, modular typography scales. Peppercorn generates a sample scale with a documentation sheet, text styles based on variables, and even generates code in a few standard formats.

Unblocked is a new image editing plugin powered by AI for generating images and vector graphics, erasing objects and backgrounds, adding generative fills, vectorizing images, and turning vectors into 3D renders.

A new analytics tool for Figma prototypes — create a unique tracking link that intercepts user interactions with your prototype and reports them back to you as stats and recordings. As a big fan of user screen recording tools, I’m looking forward to trying it out for testing.

“Bloq generates entire design systems from scratch. Users input brand guidelines to get a customized, variablized component kit — including colors, typography, spacing.”

Paint any object or person in an image to remove it completely.

A new plugin from Vijay for creating invoices in Figma.

Easily switch between multiple fonts in your designs with a free plugin.

I came across this wildly popular plugin as I dabbled into Tailwind CSS this week. Seeing a free (supported by Creator Fund) open-source plugin for generating code in a few common formats (HTML, JSX, Tailwind, Flutter, and SwiftUI) is refreshing.

Tailwind Sync is a free plugin for Figma that synchronizes variables to Tailwind code, enhancing the design-to-dev handoff with speed, consistency, and scalability.

Yann-Edern Gillet from Linear built a plugin for syncing color and text styles from Figma to Framer.

“Specifically designed for creatives, this plugin lets you apply stunning dithering effects to any image. Fine-tune details, add noise, adjust brightness, and enhance glow. With support for algorithms like Floyd-Steinberg, Bayer ordering, Atkinson, and noise dithering, it’s the perfect tool for creators looking to craft unique, dynamic visuals.”

Jake made a plugin that brings the power of CSS color-mix() into Figma. Use it to generate swatches, variable ramps, and solid or gradient fills. I highly recommend watching Jake’s video if you’re unfamiliar with this CSS notation.

Quick Tracing easily traces and converts images into vector shapes directly within Figma.

Syntaxer adds syntax highlighting to your code samples in Figma. It preserves your preferences and supports 175 languages and 28 themes.

The Foundation generates Figma spacing, color, and typography variables based on Tailwind CSS’s utilities, ensuring consistency across your design and code.

Zigma connects your design system to the production code, directly syncing design variables from Figma into your GitHub projects. Made by the NextUI team.

I shared a sneak peek at this plugin in issue \#179, but now it’s finally out! ​“Displace brings powerful displacement effects to Figma. Easily create stunning reeded glass, noise, and glitch effects with real-time adjustments. Perfect for photos, typography, and beyond.”

New plugin for Vijay Verma for creating a beautiful stippling effect.

A Chrome extension that converts any page or a section of a page into React code or an editable Figma design.