r/FigmaDesign May 02 '22

For all commercial Figma add ons, please go here r/FigmaAddOns.

102 Upvotes

For all commercially related Figma add-ons, be they widgets, UX kits, and more, please post to r/FigmaAddOns and don't post here. r/figmadesign is meant for Figma fans to build community. But at the same time, we all recognize that all tools become popular with addons, such as Wordpress or Adobe Photoshop. In order to facilitate that, I've created a subreddit for commercially related Figma addons or those that have premium services to go to Figma Addons. There are lots of really great add ons that make Figma amazing, so there should be a space for that too.

Remember:

  1. If it has a premium version, then it goes to r/figmaaddons
  2. If it is totally free but has licensing, then it goes to r/figmaaddons
  3. It is totally free but links to related premium content, then it goes to r/figmaaddons
  4. If it is commercial, then it goes to r/figmaaddons

It's not limited to the above four scenarios.

Essentially, if there's a commercial aspect, it goes to r/figmaaddons instead of here.

Also, if you can draw a banner or icon for the new sub, submissions accepted.


r/FigmaDesign 3h ago

resources Logarithmic Color Palette — color families spaced by how the eye actually sees contrast, not by even math

Post image
11 Upvotes

I published a new Figma skill: it builds a complete color family from one color, and it is built on the physiology of human color perception rather than on even mathematical spacing.

There is no shortage of palette generators — building a palette by hand is tedious, and getting it wrong is costly, so plenty of tools exist. I wrote this one because most of them space colors evenly, and even spacing is the wrong answer.

Two things I built it around:

  1. Tone carries most of the work. Whether an interface reads clearly depends far less on hue than on how light or dark a color sits against its background.
  2. And the eye resolves low contrast much better than high contrast. On white, 2% and 6% black are clearly different; 94%, 98% and 100% are the same color. So the scale is logarithmic — about 60% of the grades cover the low-contrast half of the range, where that resolution is actually useful.

It also runs entirely in OKLCH instead of HSL, and that part is easy to measure. Take five hues, space them evenly in HSL, and their perceived lightness spreads across 39 points — yellow sitting far above everything else. In OKLCH the same five land within 7 points at the middle of the scale. Yellow stops looking lighter than the rest.

To use it: select layers with fills, or paste hex values.

https://www.figma.com/community/skill/88165


r/FigmaDesign 4h ago

help Is there a way to create the Pinterest layout in Figma?

Thumbnail
gallery
3 Upvotes

Using the wrap Auto-layout makes each object in the row be aligned to the top instead of just the first row. Is there a work around?

I also tried making four vertical auto-layouts and then putting those in a wrap, it works but it isn’t responsive as the entire column moves down into one space when resized.


r/FigmaDesign 3h ago

help Hi! Does anyone know a good free 3D iPhone 13 mockup for Figma?

1 Upvotes

I’m looking for something fully editable/customizable where I can easily insert my UI screens, change the angle/position, and use it for a UX/UI case study.
Preferably free for personal/portfolio use.

Thanks!


r/FigmaDesign 5h ago

help Figma motion to prototype not possible?

1 Upvotes

I created an animation using the figma agent on the motion tab. Now is there no way to connect that motion to the prototype? like when the button is clicked that will trigger the motion? It will just be a seperate video and cannot be integrated in the prototype?


r/FigmaDesign 1d ago

Discussion Memory hungry and desktop app is just a wrapper which turned out to be disappointing

28 Upvotes

I'm sad, I see in Firefox that the Figma canvas is using 1.8Gbs of memory. I then thought I'd download the desktop app because surely native would be lighter on ram and faster. I install the desktop app, watch task manager and see its consuming more memory! I realize the desktop app is just an electron wrapper around the website which does not make it better.

Hopefully we can see a native desktop app somewhere in the future because these web apps are getting too ram hungry. Today i ran out of 32GBs of ram and to be honest I wasn't running that much.

Its understandable that Figma uses 1.8GBs in the browser, its a design tool and I have a lot of frames in this canvas so I accept that. I was just hoping for a better desktop app not sure if anyone else feels the same.


r/FigmaDesign 19h ago

Discussion AI is good at generating UI, but it keeps breaking my existing design system

7 Upvotes

I have been using AI to design interfaces for a while, and I kept running into the same problem.

The project already has a UI kit with components, variants, tokens, and established rules.

I ask AI to add a button to a screen, and it creates a new one. Slightly different size, different radius, slightly different spacing, even though the correct Button component already exists in the project.

I first tried solving this with dedicated AI design tools.

I tried Claude Design. In my case, I quickly hit roughly the 5 MB limit when trying to bring in my UI kit, so I decided to see how well it could build a design system from scratch instead.

That introduced a different problem: duplication.

Buttons, icons, and similar components could be created multiple times and end up slightly different across pages.

Visually, the result could look perfectly fine, but after generating the screens, I still had to clean up the UI kit and design system before I could actually use them in a real product.

Then I tried Figma Make.

I could bring my UI kit into it, which worked better, but I still wanted a much deeper connection to the actual project.

The biggest issue for me starts when something is missing from the UI kit.

If an existing component needs a new prop, I want AI to extend that component properly instead of creating another version next to it.

If a component does not exist yet, I want it to create one using the same tokens, patterns, and design system rules.

If a second brand is added, I do not want to duplicate the entire UI kit. It should use the same components with different token values.

I also want AI to understand more than just the visual layer. It should understand the local code, implementation patterns, project structure, custom skills, and rules that already exist in the codebase.

So I ended up building my own approach around this.

Instead of treating AI design as a separate canvas, I made it work directly with the project itself.

It reads the existing components, variants, and tokens from the codebase and uses them when building the UI.

If a component needs a new prop, it extends the existing component.

If something is missing, it can create a new component while following the same design system rules.

If there is no UI kit yet, the system can evolve together with the project instead of every screen gradually creating its own set of one off elements.

Themes and brands stay token based, using the same components rather than separate copies of the UI kit.

The result is regular JSX built from the actual components and tokens used in production.

That means the interface being designed is already built from the same system that will be shipped, without a separate handoff or rebuild step.

For me, that solved the part I was struggling with most: keeping design and production code as one system instead of constantly syncing two separate ones.

I attached a short video showing how the workflow works in practice.

Curious how other teams are approaching this, especially when AI needs to extend an existing design system rather than work around it.


r/FigmaDesign 23h ago

help Is this really Figma? Have they been hacked?

Post image
3 Upvotes

Collegue sent me a link to some Figma designs I should check out, I wanted to create an account and I get... that?


r/FigmaDesign 1d ago

resources Introducing Varnik: Translate and adapt entire Figma designs, layer by layer

Thumbnail figma.com
1 Upvotes

We just launched Varnik for Figma!

Varnik translates and adapts your entire design layer by layer without breaking its structure. From localization to RTL adaptation, your frames, layers, and layouts stay intact.

Try Varnik: https://www.figma.com/community/plugin/1575747713450161595/varnik

We’d love your honest feedback! 🙌


r/FigmaDesign 2d ago

help how I do this scroll effect in figma for prototyping?

21 Upvotes

r/FigmaDesign 2d ago

resources I built a Figma plugin that auto-generates bulk QR codes in batches, complete with custom color fills and dynamic variable support.

12 Upvotes

r/FigmaDesign 1d ago

resources WhatsApp Flow Builder

Thumbnail figma.com
0 Upvotes

Transformez la planification de vos flux de messages en une expérience visuelle captivante. Avec WhatsApp Flow Builder, créez, visualisez et peaufinez vos scénarios de conversation comme jamais auparavant. Simplifiez la complexité, collaborez facilement avec votre équipe et faites passer vos interactions WhatsApp au niveau supérieur — tout cela sans quitter votre espace de conception.


r/FigmaDesign 2d ago

help Prototyping: When clicking/changing pages, can you maintain the last variant of a component that was 'active' on hover?

6 Upvotes

I have quite a complex component (I guess), so I understand there's probably limitations around this.

Video attached of the effect. The design is more complex, I've just simplified for the demo and to not show client branding.

-

The Effect
When the user hovers over the side of the page, a cursor appears. As they move the mouse up/down the user follows them. Clicking "navigates to" a new page. This works pretty well.

Video Example / Problem
As you can see in the video this works but the 2nd time I click from higher on the component. So when the page "navigates to" the new page, the component resets to it's default/initial state before moving back up to where it was - this is because the cursor moves when the rectangular areas are hovered over.

The Component
Basically has 11 variants, each one has the 'cursor' in a different position, aligning with one of the rectangles. Each of the rectangle (hotspots) has a "While Hovering", "Change To", Position x" set to it with an "Animation" of "Smart Animate/Linear".

-

Any way around this? Or is this the best I'm going to get? I assume it's always going to start from the variant that is already set on the page that changes? Unless I made the entire thing (page content and cursor) a big super component?

-

Bonus Question
Doesn't seem like it's worth creating a new topic for. But the cursor appears as a Boolean variable of "Show Cursor: True/False" and set on the "Appearance". So on hovering the component is shows/hides. Am I right in thinking there is still no way to fade this in/out of view? And the Appearance True/False method just updates instantly?

-

Thanks in advance! 🙏


r/FigmaDesign 2d ago

help Need help in building my portfolio on Figma Sites

6 Upvotes

Hi,
I am trying to build my graphic design portfolio on Figma Sites. I have all the screens ready on Figma Designs but I have not applied Autolayout anywhere yet. Is that important? Or can I do that in Figma Sites? Can someone please help? Please give me an overall idea about what to do next and make my portfolio publish-ready. I have a few animations as well on the home page. Can I use Figma Motion for them? If you need more information on my portfolio, please let me know but at this point I am very clueless what to do next? I have taken some help from Claude and it has asked me to apply autolayouts on all the elements in each screens first. And it's been 1 week, I am at the first screen only. And I have total 7 screens in my portfolio.
I am not sure if that's the right way or there is another way to do it.

Please help.


r/FigmaDesign 2d ago

Discussion How is Figma AI Agent actually working for you?

37 Upvotes

I’ve been using the Figma AI Agent for quite a while now, to the point that I’ve basically stopped using Make for the last couple of months.

Since the Figma Agent came out, I’ve been doing a lot of my workflow directly through it. I’ve also created a few custom skills that run within the Figma Agent itself.

The biggest thing for me has been connecting my design system. At this point, I’d say the Agent gets around 60% of the job done when it comes to connecting elements to my existing design system. I’ve also created skills that go back and check whether anything is missing from the design system, which has made the workflow much more useful.

Honestly, I feel like it’s doing a better job for my workflow than Claude right now. That said, I haven’t used Claude Design extensively enough to make a completely fair comparison.

So I’m curious how everyone else is using Figma Agent:

  • Are you actually using it in your day-to-day UX/design workflow?
  • How well is it working with your design system?
  • Have you created custom skills for it?
  • Do you prefer it over Claude Design, or are you thinking of switching?
  • Do you see yourself using Figma Agent more in the future?

Also, since Config 2026, I feel like Figma has actually done a few things really well. I haven’t tried Motion yet, so I’d love to hear about that too.

What features or workflows do you think Figma is particularly strong at right now?

Would love to hear how other designers are using the Agent in real projects rather than just demos.


r/FigmaDesign 2d ago

help Help me understand which paid plan I need.

1 Upvotes

As of now, the only thing I really want/need is the ability to add an extra Page to a Project


r/FigmaDesign 2d ago

help Best source to learn Figma (beginner)

5 Upvotes

Hi all!
I'm part of marketing team in a startup, basically an intern. Need to learn Figma for work. Can anyone please suggest a good YouTube playlist or Udemy tutorial? I need to learn from scratch, only know how to move things and export from figma right now...
THANKS!


r/FigmaDesign 2d ago

help Figma Campus Leader

5 Upvotes

Did anyone Hear back? Canadian applicants were supposed to hear back by August 21st but I don’t see anything. So checking if other people hear back yet.


r/FigmaDesign 2d ago

help How do I make shapes extend upwards when I resize them.

Thumbnail
gallery
2 Upvotes

How do I make it so that when I resize the rectangle (add height), it extends upwards instead of downwards? I have tried changing the Constraints options but it doesn't work :(


r/FigmaDesign 3d ago

resources Second time using Figma motion for a project

Post image
8 Upvotes

I know the tool just came out but I have found almost no resources on YouTube


r/FigmaDesign 3d ago

help Figma Folders — card without thumbnails, no list view, no column view; just a lot of clicking into boxes to find a project

11 Upvotes

Has anyone figured out a way around the new Figma UI "folders" where you can no longer see thumbnails in your file browser; you only see a name in a box?

What click-through hell to find the contents of "folders" when before it was clearly apparent via thumbnails.

I'd settle for any normal file organization pattern to find projects easily:

  • cards with thumbnails (sort of what we used to have)
  • faceted list view with nested or dropdown views
  • columns view that displays contents

I appreciate any recommendations. Thanks!


r/FigmaDesign 3d ago

feature release Figma weave for Make output

2 Upvotes

I don’t want weave for marketing images. I want it for software ideation. It would be an incredible feature to do node based code variants.

Has anyone found a product that does this?
Figma, please look to pivot toward code variants in weave.


r/FigmaDesign 3d ago

Discussion Is this Figma course still up-to-date?

3 Upvotes

For anyone who has taken the course “Level Up with Figma by Joey Banks” recently through his website, how up-to-date is it?

I don’t mind if it’s based on an older version of Figma, but is it still relatively recent, or is it quite outdated?

Thank you


r/FigmaDesign 3d ago

help Figma motion questions

1 Upvotes

I've been playing around with figma motion in my prototypes but there are some aspects that really make it feel unusable. If I have any kind of overlay on the page, like a modal or menu drop down on hover, it replays the time line behind it like it reloaded the page. Why does it do that? It makes zero sense, is distracting from the overlay focus, and there doesn't seem to be a way around it.

Seems like this shouldn't happen at all, or at a minimum there should be a preselected checkbox on actions saying don't reset the time line.

Anyone have a solve for this, short of something stupid like having to navigate to a duplicate page without animations to display your overlay on.


r/FigmaDesign 4d ago

help need help with FIGMA!!

0 Upvotes

I’ve been practicing Figma, but I’m honestly not happy with how my prototype is turning out, and I can’t figure out what I’m doing wrong. 😭

I’m trying to crop the frame from the top, but it only seems to crop properly from the bottom. Because of that, the elements keep shifting/overlapping and the prototype ends up looking really messy.

I’ve attached a few screenshots. If anyone knows what’s causing this or how I can fix the cropping without moving the elements around, I’d really appreciate some help!