Ask the Community

I have an Accordion component and would like it to have a border of 1px solid lightblue on all sides, and a thicker border-left of 4px solid darkblue. How can I achieve this in Figma? How can I set different thicknesses and different colours on the borders of an object?

 Hi! I’m wondering if anyone here has a solution/answer regarding my issue. I’m working on a school project and need to create a blog with different entries, this is the base template for how an entry should look on the main page (Article thumbnail, title, authors, date and brief description) I have around 5 categories to do and each and every one of the articles is going to have the same elements… I’m wondering if there’s a way to create just one element and then input the data and create copies for each article on the main page (or if the only way to do it is copying and pasting it….) Sorry for my bad grammar, english is not my first language. I thank you deeply for your help beforehand. 

Hi! I mistakenly irrevocably deleted a needed project instead of an unnecessary one because Figma glitched. Is it possible to restore it? I sent an e-mail, but support takes a long time to respond.

I manage a large-scale multi-brand design system The setup is pretty large - albeit standard IMHO 1000+ text styles - where all text style properties are variable-based. Duplicating styles individually/manually is straightforward, however, at this scale, it is prohibitive. There are a few methods (cut/paste to another file) and plugins to help workflow in duplicating text styles without variables, but they don’t support/maintain variables. Any thoughts on how to do this with Variable-based text styles? Use case: We already have 3 font variables per brand: “Body”, “Brand”, “Marketing”. We want to add a “Serif” font (in variables) for each brand, by cloning (for example) the “Brand” version/tree of the text styles across all sizes/styles and applying “Serif” font variables. Any thoughts/help appreciated. Thanks. Pierre For anyone wondering about the sanity

The issue was already raised on July 20th here: https://forum.figma.com/t/missing-css-properties-for-variable-fonts-in-dev-mode/48849 The original topic has been closed, but the issue still persists. This is very important for our developer handoffs. This is the information we currently see about Typography in the dev-mode. We’re missing the information about font-stretch values. Could you give us an update when this issue will be fixed? Thank you in advance.

Hello I made a button with an animation on the icon that looks like this:  I created variables to allow me to change the icon from the instance.  My original button works as I want.But the copy with the icon change doesn't “play” the back animation.Is there a way to make this work so I can change the icon quickly without having to duplicate all the animations?

Why? Background: I work in the financial sector. We consist of a holding company and other smaller, specialised sub-companies. We are very tech-heavy and UX maturity is still in the early stages, and I am in the process of merging the companies onto one Figma. The workspaces would be ideal for this. But also for legal requirements. As we are very dev driven, we really wanted to work with the Rest API because it benefits our design system. But the sales team told me that we need at least 6 designer licences before we can get Enterprise. At the moment I am only one designer in my company. The other companies have one each. The group-wide expansion is currently being organised. I have been offered to “simply” add more licences and then I’m good to go. Can someone explain to me how I can sell the management that you have to spend an extra €4500 to make it work? I can understand not wanting to give a certain level of support to smaller teams because oth

Hi, I am working on a designsystem/ UI-kit in figma. I am currently working on the button components using variants. I want to create differents sizes. eg. small medium and large and set these as variants.I want the width to be responsive to the size of the device. For example the big button will take up the complete width of the screen minus 7px margins on each size.I know I can do this with auto-layout -> fill container and applying margin to the whole screen-frame. However I can not add this setting to the main-component button since it is not inside a frame/does not have a parent yet. Is there any way to achieve responsive components that size with the screenwidth by having "fill container"? Thank you so much in advance!  

Hi lovely Community, i am a bit lost atm….  i trying to do a style with only the corner borders are visible..  In this picture i tried it with own vectors… but i want to work it with auto Layout so it adjust to the text inside…. and the border should have some space between button (green) and the border….i need to auto layout also to work with design so i can work with variants… with normal designs and small adjustments i am capable to do… but with this kind of border i am so lost HOW to do it. Maybe someone have an idea and a good explanation <3 

Is there a way to revert to a previous value of a variable other than using another variable to store it? ie. is there a variable history so that in a non-linear process, you can revert back to the previous value (component state)?

I have multiple HTMLS. I want to embed them into the plugin through iframe, but some of the contents cannot be displayed completely.For example: In the canvas area chart, the Dark Mode button cannot be switched;However, html can be displayed and used normally on the browser. May I ask if there are any restrictions on figma? I hope you can help answer this const updateIframeContent = () => {nextTick(() => {if (previewFrame.value && props.htmlContent) {try {const iframeDoc = previewFrame.value.contentDocument || previewFrame.value.contentWindow.document;iframeDoc.open();

Whenever I move my frame, the lines i created won’t follow. They dissociate themselves(although being in a group element) from the rest of my design. How to freeze them within the frame?

I am try to recreate these chat bubbles that hug the message within them. As you can see in the video when you resize the browser the chat bubbles also resize but they still hug the text. How can I do this in Figma? When I set the auto layout to hug the text and then resize the screen the text eventually gets pushed off screen. The only way Im able to get it to resize with the screen is if I set it to fill container, but then there is a ton of space left over if the message isn’t that long. Please Help!Gif 1: Example I am trying to replicateGif 2: Fill ContainerGif 3: Hug

My organisation has an annual subscription that is renewing later this year. What is the process to change the annual subscription e.g. upgrade from professional to org, add/remove seats? What is the window in order to do so and who should we contact? 

HI All, I want to be able to select two colours and at the same time - so for example purple and pink and have it link to an image with both colours blended? what do I search for to be able to do this - We have the blended image - I am unsure and unable to work out how to do this and I suspect I dont know the correct terminologyThanks in advance 

I understand how to alter the angle of a normal linear gradient, but I don’t understand how to set the angle of a linear gradient when creating it through the “New color style” panel. I want to set it in the style so that the angle is applied to all objects that get the style.Can anyone explain how to do that, please? Here I create the new style (I don’t see any way to set the angle)… Here I apply the style… Here I adjust the angle of the gradient…

Hello: I have been struggling to make this work all day with no luck… basically I am making a filterable table with vehicle information. I have figured out how to make lines of data for each different vehilce by utilizing modes, howver I can’t figure out how to affect more than one mode at once.  For example: the first column in this table is a simple check box. I am trying to utilize a “select/deselect all” checkbox on the top of the table, but I am only able to get it to select the default mode and check the first line, or change modes and change the line associated with that particular mode. I forsee this being an issue in future filters as well, as I will be selecting criteria to toggle the visibility of lines on and off.  Here are some images to help explain where I’m at:

Hi guys, Use components from a lib by assets or by master document of the lib?What are the problems when using a child component generated from the parent component (master) of a master lib and manually inserted into the archive design HOME? Which structure should I use? Option 1Team A- Project X- archive design HOME:Assets:- lib components master- lib iconsSteps:1 - asset > Insert component to archive design HOME OROption 2Team A- Project X- archive design HOME- use component childrenSteps:1 - Archive component master lib open2 - Generate component children3 - Insert component children to archive design HOME What problems will we face with option 2?- breakage of updates from the master reflected in the child component?

Facing boolean issue. The frame is disappearing after performing Boolean. Created a new file but still the issue persists. Also restarted figma, to clear the caches. Facing this issue in latest figma version.Did, tried searching but the problem is so simple their are no proper solution. 

Why do I show the same font with different thickness, and sometimes when I click, the thin font becomes the thick reality

When I select dropdown menus on the right side of the screen, they open below the bottom of my screen, so I can't see or click on any options. Anyone know how to fix this? I can't grab and drop them elsewhere. Annoying af, especially since I’m new to Figma and trying to follow along with a LinkedIn training.   

hi there, I’m getting the following error message when linking a Figma section in Jira under ‘add design’. The error occurs with my new company Figma account and didn’t/doesn’t happen when copying a section from my private Figma account into the same Jira ticket… so I guess the error is coming from Figma.

Hi, I am trying to crete a user journey with 3 different ‘bands’ illustrated in each their own color. The shape is an S-shape.How do I create it? I have tried everything I could come up with. See picture below for exampleThanks  

Hi everyone,I am using an icon library and would like to apply a color variable named “color-icon-primary” to all the icons. When I add this library to a document / design system I will also have a color variable of the same name setup in this document. Is it possible to merge color variables of the same name to allow me to control color of the icons from the current document ? (not the library)How is everyone managing this ? 

I feel like All libraries should show All Libraries in the file. I have an additional 2 Libraries that contain color variables ONLY. These should show on the side panel perhaps with a “0” components sub heading.This means when sharing the file other designers / devs would see I am referencing third party brand colors etc from a shared / managed library. Thoughts ?