Ask the Community

Hi! I’m creating a navigation bar. Watched a few tutorials. I have done the following:I chose 5 icons from Material Symbols. made the icons as components. created a nav item from one of the icon components. created a sub-variant of that nav item. added yes and no states to both the parent and sub-variants. changed the color of the sub-variant. create a navigation bar duplicated the icons and tried to change the states. I noticed that only the first icon is changing its state correctly. but the rest of the icons only the text is changing color but not the icon. Any idea what I did wrong? 

This is a really minor issue but frustrating nonetheless. When I go through my design I make sure that certain elements like a side navigation and a placeholder browser bar are in the correct position, and locked. Only to reopen my design later, run through the prototype and see each one has shifted by a few pixels in any direction. This has happened repeatedly, and I have to go back through each page and manually adjust the placement. Most people won’t notice the minor shift, but when you’re walking through a prototype and things are shifting it looks messy. Anyone else experience this? My Figma is up to date for reference. 

Hi,I have a project, to which access has been granted for an entire Team. Nonetheless, my colleagues within that team report not being able to access the project.The project permissions state that 8 users have access through the Team, even though the Team is larger than 8 users.What might prevent the remaining members of the Team from accessing the project, and how can I fix it?I’m also noticing as I browse the Team member list, that some users I can “Grant admin access” and others I can “Invite as admin” instead. Seems like those I can “Grant admin access” to are the ones who can access the project. I seem to be unable to figure out what the difference between these users is, and therefore, how I can get rid of this difference. 

I’m able to get an image with the image rest api (GET https://api.figma.com/v1/images/:key?ids=:node_id), but it doesn’t crop the result to the provided node id. Instead, it renders everything below the top layer the node is nested under.This is what I receive from the api.This is what I want from the api roughly. Is it possible to get the desired result from this api, or do I need to explore alternatives? The node ids I’m using are derived from the url after clicking on the node in the figma viewer (www.figma.com/design/{file_id}/{file_name}?node-id={node_id}).

When will the applications for the Figma affiliate program open again? I saw this program a few days ago, and it was accepting responses, but now it is not.

I’m having issues with my prototype, I would like that when the variant is open/expanded that it would re-centre. Can anyone advise how to present correctly? (check image captions) The frame within ‘new in town’ does not have auto-layout settings as the prototype requires scroll settings and cannot function in AL. When opened, the frame will only open within parent frame.Switched to Auto-layout settings, opens as intended but cannot re-centre :( 

I am having trouble with some elements/graphics not appearing on the prototype display window, as seen below on the screenshot. How do I have them appear on the prototype mode?

When I select two or more frames, and click the action button (command + k on MacOS), I don’t see the “create component set” option, and I end up having to go back to the previous UI to create my components interactive. Please fix this problem!

Hey guys! This is my first time posting on the Figma community, pleasure to meet you all! 😊 So my question is… If you’re designing a product for a web browser and you want to test it on a phone, how do you personally accommodate for the phones notch and the browser header and footer that would usually be on the page? When I load my design on a template or on my iPhone, the content goes behind the notch and I’m not sure of the most efficient way to design around this. Is it as simple as ading in fake browser headers and footers into every design? If so, would you submit designs to developers with these included in, or remove them at the end? Thanks in advance! Tom

I have shared the design system file and design file with the client, and now the client has to reattach each component manually, which is time-consuming. Is there any smart way to reattach all components easily?

I cannot figure out how to use auto layout space between like this Youtube video - I have 2 auto layout components that are in a auto layout component wit 1440 width.  How can I Put equal spacing between so they are positioned to the front and end of the nav. How can I add padding to the left side of the logo (first component)? 

The topic I am after was closed Absolute Positioning: Fill Horizontally. Starting a new thread in hopes something has changed. I have an input field component that I have a dropdown on, it’s placed with absolute position. The component needs to be responsive; the input itself resizes but the dropdown does not. The “fill container” option is removed from the dropdown when absolute positioning is applied to it. Image below.

Hi, I am struggling with the overlay feature, and the alternative option feels brutal.  I simply want the drop down of an input row to produce a modal. Some issues I’m having include: (1) height dimensions and managing a scrollable overlay and (2) using smart animate such that the dropdown modal appears from the bottom of the input bar rather than the top of the screen. Is this not possible? The alternative would be to create a frame hide it and switch between A LOT of variants. Has someone figured out how to manage overlays in a reasonable and dynamic manner? I’m not having much luck.

Need Help Figma Auto LayoutI am having trouble with auto layout. Can anyone help me out?My Figma board scales down my nav when I scale it from my container. But, it does not work when I scale it down from the artboard. How can I fix this so when the artboard scales down so does my nav container. 

Hey there 👋 I’m getting crazy trying to understand why the super simple plugin I just created works fine locally (meaning that when I open the ui.html file generated, the ui is properly rendered) but when I launch it from Figma (after importing it through its manifest) it shows a blank page, the html inside is the template one and not the generated one 😭When I check the network tab in the console from Figma, the js is not there (and i don’t have any error when building or in the console)What am I doing wrong?Thanks in advance for whoever will take the time to help 😇

Hello. How do I find frame to use? I want to use the frame of a cell phone. I am building an app. 

I'm facing an issue in Figma. I want my button to have a hover effect with a click. But unfortunately, I can't do these 2 things together in Figma. Is this only in Figma design, or does this type of button not work in development as well? Thanks 

Has anyone else encounted editable text turning into uneditable vectors - even though you haven’t manually converted it. A lot of the text on my page is now uneditable - and I’m struggling to figure out why it’s happened…!

OK, so a common thing, at least for me as a designer, is going back some steps, copying something and then going further to the “present” and using what I have copied. Now I don’t know if it’s in Figma (probably yes) but just now in FigJam it turned out going back and copying resets history which is a big NO NO. Why would copying start new history feed in the file?

Hi there, I’m having an issue with being able to click a button an navigate to another screen. I’m not sure what I’m doing wrong but when I select the play button and ad interaction - on tap - navigate to, there is no option to navigate to the “Game UI” screen? I’d really appreciate any advice, thank you!  

Hi, I’m curious if there’s a way to export ALL assets or specific file types (like SVG or PNG) within a selected area in Figma’s Dev Mode. Currently, I’m only able to download assets one by one on the assets panel. if there’s a feature I might have missed, I’d love to know. Thank you

I am able to connect multiple frames in figma, But how do I connect multiple pages ? 

Hi! I’ve been using text variables to help map each text field to a specific string ID for localization - but when I select a text variable in a component with a text property, inspecting that text field won’t show the variable in dev mode. My current workaround is to detach all components with a text property, but I was wondering if anyone had better solutions. Thanks!

To begin with, I want to clarify, that I love Figma, it is literally the tool for web designers… sorry for the other aps, but Figma is, by its philosophy and its disposition, it is like that… so we have to collaborate to improve it as much as possible. The work that you team have done… pufff… is BRUTAL, you have really created something beautiful. Reflection: Well, as designers, or programmers we like Figma❤️…we really love it… It’s a beautiful tool. Why else would we spend time learning it and come to want more sophisticated and efficient workflows to be developed? This only happens when you have exhausted all the known methods that the program itself offers you to do what you can do… What I mean by this? In summary: the main question is clearly in the title of this topic… But really… Why is it taking so long? Is there anything we as developer

Hi, I finally figured out conditional prototyping and this is a game changer to me.Now I can use component with only one variant, but conditionally prototyped.(If you need some example: it’s a check box, and when check an additional input field “Please, specify” appears)… By default, my variable is false (unselected checkmark) and the input is hidden.This is great for prototype and usability testing using the prototype, However, I have concerns about how my PM will comment my designs and also how developers will discover that?Do I still need to create another variant to show checked view? How do you solve this?