Rolling out: Projects become folders 📂 ✨
Got a feature request or product idea? We're all ears!
Recently active
Add AHEX Color,eg:Color(0xFFF7F7F7)
JSON (JavaScript Object Notation) is a simple text format used to store and share data between websites, apps, and servers. It is easy for humans to read and easy for computers to understand. JSON is widely used in APIs, web apps, and mobile apps to send data like names, numbers, lists, and settings.OnlineJSONFormatt makes working with JSON easy by providing free tools to format, validate, edit, compare, and fix JSON errors online. It helps users quickly understand messy JSON, correct mistakes, and work faster without installing any software.
Intro There is an interesting concept in Figma that’s used and was presented by multiple people and has different names: Placeholder, Slots, Dummies, Layout Blocks, and so on: ❖ Placeholder component is the base one. ◇ Placeholder instances may be nested into another ❖ Component. ◇ Placeholder instances nested into ◇ Component instances may be swapped with any other component instances… More details in this video by @Adam_Ruthendorf-Przewoski. The next step of its evolution is Layout Blocks by @Mr.Biscuit. An issue I have a base ❖ Placeholder component: ◇ Placeholder instances may be nested into other components (❖ Column here): What I need is to nest a ◇ Column instance into another ◇ Column instance by swapping one of the ◇ Placeholders. This is needed to customize Auto Layout spacings and other properties: But when I try to do this I see an error message Failed to set component: cycle detected!: I totally understand why we’re not allowed to nest instances into their
ProblemThe UI for viewing and editing text styles in Figma has a clear and well-structured hierarchy.Styles are grouped logically (e.g. body → size → role), which makes them easy to scan and understand.However, the UI shown while applying text styles to typography does not follow the same structure.All styles appear as a flat list with limited hierarchy, making it harder and slower for designers to scan and select the right style—especially in large design systems.Why this is an issue Designers rely on quick visual scanning when applying text styles. In large DSMs, flat lists increase cognitive load and selection errors. The inconsistency between Edit/View UI and Apply UI breaks mental models. Suggested ImprovementMake the Apply Text Style UI follow the same hierarchy and grouping used in the Style View/Edit UI.For example: Group styles by category (Body, Heading, Caption, etc.) Nest sizes and roles (xsmall, small, medium → base, prominent, link) Maintain visual hierarchy and s
I would like to move into making my presentation decks in Figma, however my team does copywriting — my clients need to be able to copy text from my presentations, but I do not want them to have editing access to my Figma files, they should not be able to take the DESIGN of my presentation just to copy text.
Adding the ability to create basic charts in Figma Slides would be great. I rely heavily on displaying data in Google Slides to present to the team along with screenshots of our product. I would like to not use Google Slides anymore. Another great addition to add later would be to import a CSV with data or a Google Sheets integration to pull the data from Sheets.
Hey wonderful people at Figma, I love the new variables, absolutely love love them! Here’s just an idea, but when adding a numerical value variable, I wish I could include only “Paddings” as the supported property. Right now when I want to save paddings I have to use “gap (auto-layout)”. While usually these properties are the same value and I can see the though behind not separating them, I do want to play around with them and would like them to be separate, especially when changing modes for device sizes. Additionally, I’m not gonna start a new thread and I’ve already upvoted the ones I’ve seen, but I would also really like if I could use prototype interactions to change between modes. Thanks and have a lovely day!
Hi Figma!I’m a developer working with a team creating a design system and React component library. Our designers use tokens for pretty much everything, and a key part of our workflow is exporting the tokens as CSS variables, which can then be used in our React component library.To do this, we use a community-created plugin called Variables2CSS. It’s fantastic that someone created this plugin (thank you to the author!), but it presents us with one main problem: we need to be in Design Mode in Figma for the export to work correctly. If we’re in developer mode when we use the plugin to export the tokens, some tokens go missing.This is a problem within my team, as we need to purchase a designer license for each developer who needs to export the tokens. As my employer will only pay for one designer license for this purpose I am stuck being the only developer in my team who is able to do this. It’s a hassle for me, and if I go on holiday, or I’m off sick, the team is stuck and development is
I have a slide with an embeded prototype. The prototype is an interactive logo which is supposed to have a surprise interaction on hover. But the prototype loading totally ruins the effect. There would be several ways to fix this:Allow for preloading of prototypes on previous slides Allow for fading in of a prototype after it has loaded Allow for a mask to go over the top of the prototype which fades out after a certain amount of seconds. (Currently this is not possible because prototypes are forced to top layer.)Image shows the context:Logo is actually a prototype where letters swap on hover
There should be a option to add like 2 strokes, like heres an example below:https://imgur.com/a/jjNJWNF
Why wouldn’t a variable’s “description” from the details panel not be included in the variables export JSON data?
Description: The feature allows users to export local variables from Figma as a single file, making it easier to share design tokens and maintain consistency across projects. Current Format: Currently, local variables in Figma need to be copied individually or manually noted down, which can lead to errors and inconsistencies when transferring information between team members or projects. Proposed Enhancement: Implement an export option that allows users to select multiple local variables and save them as a single JSON or PDF file. This file can then be easily shared or imported into other projects or reviewed by developers. Benefits: Streamlines collaboration by ensuring all team members have access to the same variables. Reduces manual errors and saves time in the design handoff process. Enhances consistency across designs by providing a single source of truth for variables. Others: This feature could also include an option to import previously exported variable files, creating a se
Figma’s variables feature is a game-changer for design consistency, but what if we could take it a step further? Imagine a seamless connection between Figma variables and SCSS, enabling real-time updates across design and development environments. Here’s how this could work: Proposed Features: Export Figma Variables to SCSS: Designers can define variables (e.g., colors, typography, spacing) in Figma. These variables can be exported as an SCSS file with proper formatting. Example: scss $primary-color: #FF5733; $secondary-color: #C70039; Sync Updates from Figma to SCSS: Changes to variables in Figma automatically update a connected SCSS file. This enables design updates to reflect in development environments, at least in staging or development builds. Dev Environment Integration: While not live editing, changes in Figma could trigger updates in a development environment. Developers would get notifications or GitHub PRs for updated SCSS files generated from Figma. Use Cases
I was playing around with the idea of using variable modes to easily switch between using Latin script and, say Arabic, but where I think I’m let down is having to manually change the text left-right-center alignment. Thanks!
At the moment my interactions look like this: Is there a way to combine them all in one action, so “Set Variable 1 and Variable 2 and Variable 3 to false” ?
I like the prototype feature in designing products. In Figma Slides, I’d like to have the option to have a variety of starting points/journeys with shareable presentation links so that I can keep the content of my slides centralized yet tailor the journey per audience.
I’d love to see CSS-style color adjustment filters like brightness, contrast, hue-rotate, and saturation introduced as Effects. Oftentimes, I end up endlessly tweaking different blend mode and color fill stack combinations just to hit the right saturation or contrast. This can be frustrating, especially when it could be done more precisely and in a fraction of the time with a direct way to set these values.I’ve also found blend modes to be less developer-friendly and prone to unnecessary complexity. They absolutely have their place, but for software and web design, color adjustment filters seem more practical in many cases. Blend modes feel like a legacy holdover from graphic design tools and they can be a pain to implement consistently with devs.
Maybe this is addressed in the UI3, but one thing that causes me a bit of difficulty for some time is how hard to view some dark components are in the dark mode assets panel. Especially icons with dark color as a default.
Hi Designer,as we know iOS platform journey header title aways align center as below,but today we find Figma as below for SG iOS Pure App Important Information Journey Header Align Left.https://www.figma.com/design/Hs9eZBj4jzDDzBUYYIDY0K/%F0%9F%93%B1--Global--App-Launch---Setup--draft-?node-id=2951-54833&m=devIt may be not follow iOS standard, iOS customer may be no need all align with Android standard.(this is my thought)Could you pls help clarify whether required align Left ? Many thanks~
I assume figma AI is only for paid plans especially because it is a costly thing to maintain and run, as it requires datacenters and a whole team behind itHowever some people have a PC that could run with no problem an AI model. Same for figma filesMaybe Figma should make available to it's users to run AI models locally and store files locallyThis would maybe help figma reduce costs tooIdk I may be wrong
I’m pretty sure I won’t be the only one… but I tend to open the same figma in different windows without noticing that I have 2 or 3 instances of the same file opened. I really liked how chrome solved it with the dropdown on the top right to navigate between recent and opened tabs. It would be very helpful.Thank you!
when i duplicate style in the style panel, it does not rename it automatically. It is a big issue as the user is unsure which one is the original and which one is the duplicate and then continues to update the the properties of the style he assumes is duplicate. Now he could be updating the original style which is applied to the designs and might mess up the design. There should be some way to differentiate the duplicated style immidiately when it is duplicated...i think it is the same with variables.
As a user that uses Grid for designing tables (header, rows). I would like the option to add new rows or columns and change the order of the rows/columns. when adding a new column/row to an existing populated table does not mean I want the row/column to be at the end of the grid. The current design options (drag and drop) make it very hard and frustrating to introduce edits to existing populated table designs.Design idea: add drag icon to enable rows/column drag (change order) in addition to the number order of the rows/columns
I was wondering if you can set the horizontal or vertical wrapper in Auto Layout to inverse. I think that option should exist—it’d be genuinely useful in code.
Hey Figma Team,As a designer who relies heavily on Figma Make for my design-to-production process, I wanted to share some insights and suggestions that could really enhance the overall experience. Below are a few key pain points I’ve encountered, along with a suggestion that I believe would greatly streamline the workflow.1. Challenge: Large Frames Automatically Converting to ImagesWhen uploading larger frames from Figma into Figma Make, I’ve noticed that sometimes they automatically get converted to static images. This compromises the flexibility of working with vector-based designs and impacts the quality and adaptability of the final product. It would be fantastic if there were a way to either prevent this conversion or handle large frames more intelligently, allowing them to retain their original quality and interactivity.2. Challenge: Manual Batch Uploading for Multiple FramesCurrently, I’m limited to uploading only three frames at a time, which quickly becomes cumbersome when wor
Already have an account? Login
No account yet? Create an account
Enter your E-mail address. We'll send you an e-mail with instructions to reset your password.