Ask the Community

I have 2 icon libraries of different sized icons at 24x24px and 32x32px, Icons are named as such: 32/Right Arrow 24/Right Arrow etc.... These icons are in a frame titled Icons and published as a library.When I use these icons in a button with an Instance Swap property added for the icon, I can select from the Icon 24 folder or the Icon 32 folder:When selecting from the 24 folder, the resulting Icon is not 24x24px, it is resized to  ~ 32x32px. The original button was created using a 32x32px icon.Why does Figma not respect the icon size selected in the instance swap? I have tried creating the icons using the Icon Resizer plugin which uses auto layout and  manually with a frame and no auto layout. I have tried various settings in the auto layout options - fixed width (set to 24x24) and hug contents, nothing results in the selected 24x24 icon staying at 24x24. Should I have created icons with variants for the two sizes 32x32 and 24x24? Must I make two separate buttons one using a 24x24 ico

Is it possible to adjust the position of multiple overlays at once? I have a nav component with a dropdown set as an overlay which appears on each page. Everytime I edit this component (font size or link change) i have to go through every page and manually adjust the dropdown overlay to reposition it back to the horizontal center. Command + Alt + A doesnt work. Anyone know of a workaround?

If we have a design system, do we also create design local component page in our product files? For example, if we have different row data across multiple tables in our product, do we need to create those row tables as components on our own product pages?

Hi everyone, I’m trying to figure out how to download .fig files using the Figma API, similar to how the Magicul app does it. I found that Figma’s API doesn’t allow direct downloading of .fig files, and the .fig format seems to be mainly for manual backups. 

We were working with someone at Figma to get full access for our teachers and students, but she is no longer getting back to us so we can't move on.  Does anyone have a contact to get this moving?  I tried the Support Center and the Chat, but I am getting nowhere.  I don’t want to start over.  We already had the Education Order Form completed and signed.

This is my code:const image = figma.getImageByHash(imageHash);    const bytes = await image.getBytesAsync();    const bytesArray = Array.from(bytes);    const fileName = `${folder}/${nodeName}_${imageHash}.png`;I tried to use blobs in ui part, exportAsync in plugin part and tried to find other ways but I couldn’t. What I need to do? 

Hello,I accidentally activated the Dev Mode in Figma Pro before the invoice was issued. Could you please help me cancel or revert this action?Thank you for your assistance.

I can’t for the life of me figure this one out. We have a card design with a BG image and some overlay graphics on top. The bottom level is a label and a text box with a BG. The text box should scale with the top level which is the image & have a minimum width at the same time if there is not enough text to fill the full width. However it seems like it is impossible to do without making it fill the entire top level?   

Let me explain what I need, and hopefully someone can tell me if it’s possible.I already have a fully coded and functional design system. What I want is to design in Figma using my existing design system components — but instead of Figma Make recreating all the components from scratch (which isn’t useful for my workflow), I’d like Figma Make to pull the actual code of these components directly from my existing sources (e.g., GitHub, Storybook, etc.).I can connect all the components using Code Connect UI but that don’t do anything for the Figma Make Is that possible?

I have searched for this answer in the forum, but haven’t been able to my situation represented yet - so here goes: I am a design manager who needs access to all projects in my company, but do not want the notifications for all projects. Currently I am unable to find, either within the Mac desktop app or the we app, where within a specific project there is an ability to turn off notifications (currently getting both a pile of emails, as well as Slack notifications in our generic Slack integration- not channel specific). Any help to turn off one project notifications would be greatly appreciated!

Hello,What I am trying to accomplish is when all the balloons are popped and down to the last, it automatically navigates to the next page. I’ve tried the following variables Action 1: On Click → Change to → popped variant Animation: Smart Animate, 150–250ms Action 2: After Delay → 200ms → Navigate to → Final Questions frame Easing: Dissolve or Smart Animate That’s it. No condition needed; you’ve already decided it’s the final balloon. If you must keep a variable/condition (e.g., only navigate when poppedCount == 8): Create a Number variable in a collection called AppState. On each balloon instance’s click: Set variable AppState.poppedCount = AppState.poppedCount + 1 Change to popped (put this after the Set variable) On the screen frame (not inside the balloon component), add: On Click (No—don’t do this) Use: After Delay → 1ms → Conditional → If AppState.poppedCount == 8 → Navigate to Final Questions Place this above any other g

Hello,I am needing help on getting the balloons to pop and go to the next page. I’ve used the following: Select the Component Set (the top-level that holds both “Default” and “Popped”). Look in the Prototype panel on the right. If there’s a “Delay → Next Frame” interaction here, delete it — it affects all variants. Now click the “Default” variant (inside the component set). Add only this interaction: Trigger: On Tap Action: Change to → Popped Animation: Smart Animate Then click the “Popped” variant. Add this interaction: Trigger: After delay (300 ms) Action: Navigate to → Next profile frame Animation: Slide left Now, each variant owns its own prototype logic.No more shared auto-trigger.

在AI为什么我没有AI功能？AI功能入口哪里啊

Download code buttonI spotted the "Download Code" option in the upper right corner of the editor, but I noticed that there is no "package.json" file. Is there any documentation or a way to run these projects locally using my own IDE?

I am conducting a useability study and would like to record the click path my participants use when interacting with the lo-fi prototype.Is there a way to have it automatically record whenever anyone interacts with it? I have no control on the specific time they choose to view it.Thanks.

Hi all I’m running into the problem of my text not changing if I change my component. Let me run you through the steps I’ve taken: I have a component ‘Wizard step’ with 2 variants for a step indication. Tested this, if I change my text and then change the variant, it remembers the text. Awesome so far. Now I make a component ‘Wizard flow’ with 4 of these steps, because I will use the steps on different frames and I want the texts and prototype noodles to be the same from all these frames. Now I use the ‘Wizard flow’ on my 4 frames. I override the variant of the ‘Wizard step’ to indicate which step is done or not done. Again, so far, so good. But now, if I want to change the naming of my steps in my ‘Wizard flow’ component. What happens is that it only takes it over in the steps where I did not change the variant of the ‘Wizard step’. In the frames where the variant was changed, the old text is still visible. I had a complex setup for making wizard steps with many more variant

Hello, I'm a product designer and I recently had an accident and amputated my left arm. I would like to know if you have a tutorial on how to work only with the mouse. What I missed the most was when duplicating a variant to display the properties (Alt + mouse drag).

I’m publishing my site that was built using Figma Make. The DNS is already connected, but the issue is that the latest version of my site is not being pushed live. Everything seems to be set up correctly, yet only the older version shows up.Can anyone help me figure out what might be causing this and how to fix it?

Hello everyone!I’ve been exploring Figma for a while now and have been practicing different designs for both mobile and desktop screens. This time, I wanted to try something new and chose a self-ordering kiosk design for a fictional restaurant. Basically, I’m aiming for a countertop ordering terminal.Right now, I’m a bit unsure about the correct frame size for this type of design. I went with 1920×1080 for now, but I’m not sure if that’s ideal.My second question is about the font size. What would be the most suitable sizes for such a layout?  I’m working on the first three screens right now: a start screen (to begin an order) and another for selecting between take-out and dine-in. After that comes the first menu overview, where I’ll definitely need smaller fonts to fit more information, unlike the two before.Could anyone share some advice on the best frame and font sizes for this kind of kiosk setup? And what is the best way to figure out how to choose the correct one? I know, that usi

I’ve built a component, added a bunch of instances of said component to my layout, and now decided to change one of the font styles in the component. So I go back to the main component, make the change and…nothing. I can’t get all the instances of the component to reflect the change. I also tried changing font size. Same thing. No changes to the instances of the component. Tried color. That works! I can change the color! But not anything else. Is there a way to force these font size/style to change throughout the instances?

When changing an icon’s color in a button component, the color change doesn’t appear on the buttons where the icon has been instance swapped. This was still working yesterday, and I tested it on several projects with different icon sets.

I encountered an odd problem about using “figma.createImage” to create a image hash. I have 3000+ image urls, I want to fetch image data, then convert to image hash  to display. When an error occurs, the console shows: "in :<unknow> Attempted to invoke callback with invalid id -xxxx". Are there any limitations on fetching images in Figma?this is call stack:It seems fine when image requests are fewer than 2,000, but ​​when they exceed 2,000​​, errors often occur. code:interface ImageLoadTask { figmaElement: RectangleNode | FrameNode url: string width: number height: number transform?: number[] depth: number}const ImageLoader = { queue: [] as ImageLoadTask[], MAX_IMAGES_PER_SECOND: 500, isProcessing: false, imageUrl2Hash: {} as Record<string, string>, imageUrl2Promise: {} as Record<string, Promise<string>>, async load( figmaElement: RectangleNode | FrameNode, url: string, width = -1, height = -1, transform?: number[], depth = 0, ): P

Can I somehow skip all the undeletable “custom style” and see my actual work palette as first thing in design mode? 

I´m creating an application with a certain degree of complexity in terms of functionality, and my design has stopped working.Has this happened to anyone else, where it stops working and the design is completely ruined?request ID: ef5551f8-5b75-4080-8000-000000000000 

Why have my curved lines gone from this (left) and this (right)? This looks hideous, and figjam won’t let me change it or CTRL + Z. Please tell me this isn’t some hideous update they’ve made on purpose.