Ask the Community

I’m working with developpers and they need to be able to consulte our variable library to integrate our design system (espacially the colors). Does anyone know if, when you are a viewer it is possible to consulte them ?

Hi All! I am completely new to Figma and I designed a website homepage that has 49 different variants based on mouse hover interactions. I got everything up a runnign however I cannot find a clear answer on how I get the Figma deisgn to an actual website. I’ve tried the following plugins: Figma to Wix, Zeplin, Anima, TeleportHQ, Figma to HTML and CSSSiter.io Perhaps I’m not using to right keywords to try to answer this but in short, I want to get my design and interactions (the component and all 49 variants) onto the site.

How is it possible that ALL plugins available to export variables into CSS convert the name of the variables to lowercase? You can set variables in Figma to be uppercase and when you inspect, the CSS will show the variable in uppercase: color: var(–Patch-Reef-Blue); But all the variables export plugins will convert this to color: var(–patch-reef-blue); therefore the need to manually rename… Is this me or Figma? Thanks!

I designed my app for iPhone 16 Pro Max.Now I want to use Prototype to scale everything down to see how it looks on smaller devices.So I select iPhone 13 Mini in Prototype Settings.I get an enlarged iPhone 13 Mini. It is iPhone 13 Mini form factor, but on my screen it takes up the same area as the iPhone 16 Pro Max. It is currently set to Responsive.Now I go to this page, everything is messed up on Preview only. On the design itself it is ok. Here is how it looks like on Preview:Here is what it looks like on Fixed:And there are similar issues throughout the rest of the app.Before I preview on iPhone 13 Mini, there are no issues previewing on iPhone 16 Pro MaxWhen I switch back to iPhone 16 Pro Max on preview, these issues persistHow do I fix these issues with Preview?

PPT file import feature into Figma.  How do you preserve the fonts from your PPT source file after importing into Figma? I tried it and all fonts and its formatting fell apart.Is there are a way to preserve fonts when importing? 

Hello Community. I've been given a task to make some modifications to a dropdown menu, but I'm confused. I'm hoping somoene can please give me some more insight about the following changes I need to make. I tried to understand What the programmer is asking for me to make these changes. I follow his instructions on A) states 1, 3 ,5 to replace states 2, 4, 6.  So on column A is following as he has instructed. Now on B, he says, state 4 should be copied on state 2 and 6 And make 6 more brighter.   Have I understood correctly? Is column B as it should appear according to his instructions? Thank you.

Hello Figma Community. I’m fairly new with Figma, and also with web interaction concepts, because I’m coming from the world of print design. I have a question related how this particular concept works with a 6 state button function. I’m confused why it’s set up the way it is, with the hover states being on 5 & 6, and not on states 3 & 4. One would think, the button by default is OFF, and when the mouse hovers over the button it would HOVER, then when pressed it would make some change of colour (button Background or text colour Change).  I have been assigned a task in my group, and this is the layout of the buttons, Can someone please explain how this works, and what would be a good example, by making a mock up I could possibly follow the layout.     Thank you.  

What is the difference ? Why it exists when there is native fetch?In both fetch, the request is performed in the user machine (the desktop Figma app where a plugin is running ) or it’s proxied to an internal Figma server ?In case it’s proxied , is there a list of known Figma IP address to use as whitelist? Context: plugin development

I am using supabase auth for users in my figma plugin, and it requires me to store supabase_url and anon_key. These are sensitive variables that should not go public. Storing them in ui.html is not recommended as it is easily inspectable. So I researched about different approaches. One way I found is by storing them main thread (code.ts) which can communicate to ui.html via post messages. Although I am not sure that this is the perfect way to conceal your sensitive variables. I need help of developers building on plugin to give some insights. Thanks!

We have the “Select Matching Layers” tool, which will selected matching elements across different Artboard/Frames… but is it possible to do a similar thing for elements on the same page? It seems like it’d be a great feature if you had (for example) a grid of ‘product cards’ for an eCommerce website design. All of them are going to be made up of the same bits. So selecting the image or text of one of the cards, then being able to select all of the matching elements within the parent frame/group to edit would be neat. Then you could edit without needing to go through and click on every single instance - of course I’m talking about stuff that isn’t a component here. Is there a way to do this now and I’m just missing something - or is it a good feature request? Thanks in advance!

I created typographic styles for headings and paragraph text and applied them throughout my design. When I change them, some of the text styles are changing from “Ag” to “T”. The text styles that have “T” in front of them are not propagating into designs. This is unbelievably frustrating, especially because it seems like it’s randomly applied to some styles and not others. How do I fix this?

Hi, I’ve searched everywhere, but cannot seem to find out how to make the Resizing Panel show up on the right hand side. It’s just not an option that I can seem to access. Is there a certain shortcut I need to hit to access this like there is with Auto Layout?

Hello.I have a lot of icons with different names and spaces in them. I need to remove the "Pixel/Solid/" in the name, leaving only the final name of the icon, and also remove the spaces where they are present.I read the information about renaming, and there was an option with variables, but after trying it, nothing worked for me.  

We have december now, and i still cant acces the first draft feature, is this normal? I have the newest beta an ui, but its still not there?

Is there any use fo this tiny circle present in Linear Gradient? 

I keep receiving the following error message when attempting to run plugins: “An error occurred while loading the plugin environment.” I’ve cleared my app cache, restarted, and uninstalled plugins all to no success. When I open the console, it seems to stop at this point:

Hello. I am putting the finishing touches on my prototype but one thing is bugging me. The entire screen, including the status bar is pushed out when a new screen comes in. This obviously doesn’t happen on real phones but I can’t figure out how to do it.I tried choosing “animate matching layers” but when I do that, the screen that is sliding in has objects that don’t slide properly or stay visible when they should have disappeared, like some weird layer-stuff going on. I am sure this is simple to do but I can’t figure it out and it’s driving me crazy! I would greatly appreciate anyone sharing their process for making the screen move in/out from side to side (not scrolling) while the top status bar stays put.

This ever happened to you?:Used the scale tool (K) Stepped away for several minutes/hours Because the scale tool is visually subtle and persists until explicitly closed, after returning, you don’t immediately notice why properties and other controls are missing You’re briefly frustrated :/

Please help I use a custom font in this file in my team and I have to re-install Figma agent everytime I reopen the file. I have the custom font downloaded properly on my laptop, but everyday when I first open my file I have to re-install the Figma Agent software to enable my local fonts in Figma. How can I fix this??

Hi there, I have a simple layout in essence. It’s a ‘table’ that overflows off the horizontal edge of the viewport. The problem occurs when I try to main a section ‘sticky’. This won’t work when a horizontal scroll is introduced. You can see the basically layout and sticky scroll on this prototype. This is how the page should ‘work’. But when you scroll horizontally I want both the sticky element + table content to scroll at the same time. When I add the scroll to the parent that contains both the sticky section and table data, this happens. The scroll ‘works’ but the ‘sticky’ element is lost. Is there a way around this? Here you can see my Figma file (view only). I’m at a lose at how tor resolve this - maybe it’s not possible? As an aside, I want the table headings (in grey) to remain in view always. I couldn’t find a way for them to be ‘absolute’ and not scroll out the viewport. So I had to duplicate the text and put it over the top of the scrollable section so it didn’t move. You ca

Just recieved my yearly invoice and it hs doubled in price.Figma has decided to add another full seat to my account. I am unable to remove this using the account dashboard.I have submitted a support ticket but heard nothing - how on earth do I do this? And where is the support Number to call for help?   

I want the NEXT button to be below the Select Option when it drops down. But i dont want to autolayout all of it together. I still want the NEXT button to at the bottom right corner. Can anyone help with this? Thank you!

Does anyone know how to completely export node from Figma so user can later rebuild these nodes with just the export? I know there is exportAsync({format: ‘JSON_REST_V1’}), but the exported JSON will encounter many problems when trying rebuild node in Figma, like wrong positioning, color setting error etc.

Hi, I am trying to nest 2 accordion components within each other. I have both of them created as separate components with the height set to hug contents. Individually, the container resizes accordingly during prototype testing. When nested however, the outer container does not resize with the contents inside. Any suggestions on how to fix this would be appreciated! Thanks in advance! Video of issue:drive.google.com

I was checking a library component and saw that an specific component was using a mask to exclude a frame from a rectangle. This way of working was pretty interesting because it was not a exclusion from the element one from the second one. I was trying to replicate this but seems like the best secret in the design world.