Ask the Community

https://www.raycast.com/core-features/aiI am trying to recreate a specific UI effect I saw in a design (see attached image). I'm particularly interested in achieving the following: Subtle Edge Fade: The icons near the left and right edges of the dock/bar fade out smoothly. How can this be achieved using gradient masks or other techniques in Figma? Icon Style: The icons have a distinct appearance: a combination of neumorphism, transparency, subtle shading, and a glow effect. What are the best approaches to replicate this style in Figma? I'm looking for step-by-step guidance, best practices, and any helpful plugins or resources that could assist in recreating these effects accurately. Any help or suggestions would be greatly appreciated!

Hello thereSo I am trying to build a test app just to hone my skillsAnd one of the parts I want to implement is something where when I click one of the tick boxes Cafes with that drink will pop upand when I click MULTIPLE boxes, Cafes with ever one of those drinks will pop upFor exampleCappuccino Tickbox Espresso Tickbox Matcha Tickbox When the Cappuccino box is ticked- cafes that serve Cappuccino’s will pop up When the espresso tickbox is ticked, cafes that serve Espresso will pop up Same with Matcha   NOW when I click MULTIPLE tickboxes (Matcha and Espresso) only cafes that serve BOTH Matcha and Espresso will pop up How will this be done please because I assume you use variables I just have no idea how I would apply them and how i would use multiple variants of the cafesP.S If someone could make a demo of this it would be extremely helpful THANK YOU https://www.figma.com/design/HsvtuUl8cAwQn0208bjn2t/CAFE-APP--Copy-?node-id=0-1&t=eiJpi1vP8c5NDHV7-1Link to the figma file

My figma file would automatically delete some content from my design draft, resulting in a large area of content being lost. Even after I retrieved it from the historical files, the content would still continue to be lost. I felt very panicked

In order to create a chatbot based on a flow chart I created with Figma, I have to give each item a unique code.Is there any automatic way of doing it?Doung it manually is a hassle… Thanks

Hello, i’m going back to figma after a while without practicing so i’m doing some project for fun. I only learned it during 1 year of school so i don’t have all the tips. I’m actually trying to do a little database of a video game i like and it’s been some days i’m stuck with this problem (see the image below). I have cards with the full art of my characters and i created components to have a portrait of them on hovering. But when i hover, the card is coming on the front over the filters. And i really don’t know what i’ve done wrong here.The cards components are set in “open overlay”, in “manual” position. And they are not inside anything, they are free (second image).If someone have any clues or ideas of what my problem is, i’ll be glad to listen ! And i can give other informations if you need Example of my prototypeLeft are the components (portrait) and right is my main page.My layers are like this. I got my main frame with the cards and a section with all the different hover version

I previously asked if anyone at Figma is in fact using components with more than 10 variants and care about sorting them? I asked why they did away with the pill-shaped list that was better? Looks like they keep pushing this absolute garbage vertical list that most of the time cannot be reordered and the same time waste a lot of space on the right hand side of the variant names.I reported this several times, sorting of variants is either not working or is at best clunky when it does.Today, yet again, I am not able to sort / reorder my variants. This keeps coming back again and again, it’s ridiculous already.Now I genuinely ask myself if this is actually a Figma feature or I am very, very stupid? Since I hover over a variant, click to grab it, drag it around, and not only it will not scroll down in that garbage list but will also release that variant IN A RANDOM PLACE. Like what --?So I would like to know if this works for You and IF it does -how you are doing it / where I am wrong?? Ar

A (another…) small rant about UI3. The new UI3 bring a lot of good features and abilities. but some design decisions i just cannot understand. One of them for this example is the massive reduction in the clickable area of menu components. As you can see this screenshot, the previous clickable area for menu items stood on 32px heigh and (at minimum) 240px width. This translated to 7680px of clickable area. In contrast to that, the new UI3 is able to give us only 24px height with only 224px width (on the 240px minimal setting) which are only 5376px of clickable area. This is a reduction of 30% in clickable area! multiply that by as many items you have in the menu. for this example i took the pages menu panel. Not to mention the gap between each item of 5px. this makes the clicking menu items very hard. What was the reason for this design? now we get a more cluttered design (more elements fit in the page) but with less space to select them… You can argue that i can control the UI scale fr

Hi all, I am working on a design for our sister company which is a white label of our main site. So I have duplicated thats site over to a new file and now need to replace to match the styling of the sister site. When I change the font it normally updates immediately. But its currently not changing and the small preview icon “Ag” for the font changes to a “T” Do anyone know if there is an issue currently?  ThanksSimon

Hi everyone, I just used Figma.I have a question about text, it doesn't show up on my screen while I’m typing. I've confirmed that the opacity was 100% but it still doesn't show up. I've also reopened the page but still doesn't work.Can someone tell me why?? 

Lots of posts about copying variables between files…but how do we copy variables between modes? I have a thorough set of variables with light and dark modes. Figma recently made it possible to apply variables to shadows. So now I added the variable set for shadows. However, it seems that I have to manually set the variable for each of the items in BOTH the light and dark modes. 🤬 Am I missing something? Does someone have a better process that I am skipping? How can I duplicate from one mode to the other without ending up with a whole third mode? This feels like missing functionality to me.

I want to integrate tiers into a my design systems model to provide a framework for managing the evolution and maintenance of design system components. Currently everything is under 1 master but I want to use the following information architecture for the tiering process:The top level is "Design System Library."The second level has two branches: "Core" and "Product."The "Core" branch has three sub-branches: "Stable," "Beta," and "Vision."The "Product" branch has a sub-branch: "Experimental."How can I create the second level branches using the top level? See attached IA. Please help. Thank you!  

When I need to create a mask with the command CTRL + ALT + M in Figma UI3, the shortcut doesn’t work, I’ve already checked the keyboard, the shortcut itself, but it doesn’t work, I can just go manually through the properties panel on the right. Furthermore, when I do it manually, there is a kind of green demarcation where the mask was made. Does anyone know why, or if this is due to a beta bug?

I just restarted my Figma application and something weird is happening in a project that I’ve been working on for months.So in the first photo, it shows a screenshot of the button in the hover mode, but when I hover over the button in preview, it comes out as a square (second screenshot). It wasn’t like this ever and was perfect just an hour ago, but all of a sudden when I closed and reopened my application, it started glitching.The third screenshot is the screenshot when I changed the state to hover (which shows up how it should), but the hover animation next to it in preview mode shows up as a square.The fourth screenshot is the master component which shows the 3 states so I have no idea how it’s possibly showing up as a square in preview mode. 

I just restarted my Figma application and something weird is happening in a project that I’ve been working on for months.So in the first photo, it shows a screenshot of the button in the hover mode, but when I hover over the button in preview, it comes out as a square (second screenshot). It wasn’t like this ever and was perfect just an hour ago, but all of a sudden when I close and reopen my application, it started glitching.I’ve tried refreshing the application again numerous times, but nothing is working. 

Despite an extensive search coming up short, I am trying to determine if interactive components (like check boxes, dropdown menus, etc.) are available for use in Figjam. I have successfully created a dropdown menu in Figma Design but copying/pasting into a Figjam board doesn’t seem to permit the interaction with the component.

I am currently working on a group project in my web design class where we have to create a website. So far I have created and mapped my button to do the actions that I wanted them to, which hasn’t been a problem. Right now my issue is, I can’t resize my buttons to fit my web page frame, without at least one component of the button changing. I have text inside of my button that I want to shrink as well as the outside. I am very new to this and we haven’t done a whole lot of project in class and were kind of thrown into this. Is there anyway to completely change the size of the button hundreds of pixels without changing the properties. I only made them as large as I did because they were easier to work with on my page scrolling and doing multiple at a time. i will provide pictures to show the issue that I am having and if anyone can help me, I would appreciate it so muchThe first photo is the original button. The second is what it does when I try to resize. And the third is a list of my

Regardless of what I do, I am unable to reproduce what settings I need to select to result in having all view options available. Sometimes everything shows up, sometimes it’s only fixed size and responsive. Doesn’t matter if it’s web or desktop, design or prototype, a specific frame selected or not. I need all five option to show up persistently.

What if I have a professional plan on my own and my friend has a professional plan on his own.What happens when we want to collaborate on the same file? Do I have to pay an extra seat for him again?

Good afternoon!We are an English language school. About a year ago, we created a Figjam account and verified ourselves as an educational institution. All of our students did the same - they registered and were verified. In October, our students started receiving emails warning them that the free access would soon end, but they had the opportunity to re-verify, and thus continued to use the service. Currently, one of our students has received a letter warning that his free access will end in 2 weeks and that he will not be able to re-verify. What should we do to extend this student's access? What should we do to ensure that our other students do not face this problem?As far as I remember, access to free use in the Figjam Education plan was supposed to be provided for 2 years, so we expected that we and our students would not have to pay anything for at least another year. Have the conditions changed? 

This may be a basic question but I’ve kinda hit a wall here. I’ve made two components for my expand/collapse menu (one for “Family” one for “Merry"). I have them placed on two different frames. The intention is to be able to change from “Family View” to “Individual Child View” and back. The components are prototyped to expand and collapse individually. I want the flow to be as follows: Tag to expand the menu > Select Child > Navigate to Individual Child View with Collapsed Child menu. I have them successfully expanding/collapsing and transitioning between frames. Yay! The problem is, that even though these are two different components, the menus don’t collapse after the fame change (even with the state set as collapsed in design mode). What am I doing wrong?  

I noticed within the official Apple iOS 18 library that “examples” is prioritised and placed at the top of the list including a divider. Does anyone know how this can be achieved?  

Hello,A year ago, we paid for seats through my partner’s account. However, she no longer works with us. While she was on vacation, Figma renewed the subscription for another year.We can't manage our seats now, and we need to transfer the paid seats from her account to mine.All seats were paid with my VISA card — Aleksei Ilin.I’m unable to contact support directly because we have a standard account. Has anyone had a similar situation with a positive outcome?

Hi, I am moving out of the company and want to transfer my Professional license(Annual Plan) which is valid for another 6 months, to a new user who is taking over from me. Can someone help me with this?  

i feel scammed by Figma

I’ve done some searching but can’t find much — not sure if I’m missing something. I’m currently building out a card game in Component Studio, a platform that allows you to connect a dataset to a card visualizer/builder that then populates each card. I’m wondering if it’s possible to do something like this in Figma — specifically, connect a dataset that populates text/links components. It’s a bit complex in that there are over 60 unique character cards and each character has a different rule and quality, etc. I’d love to avoid having to do this in InDesign if possible but it seems like it’s beyond the scope of what Figma can do. Maybe it can be pulled off with a combination of plugins?