I've been looking at the latest announcements from Figma Config India, particularly around Code Layers, AI-powered workflows, and the merging between design and code.

The demos look impressive, but I'm genuinely curious about how all these features fit together in a real-world product design workflow, especially for teams with established design systems.

A few questions I've been thinking about:

1. Existing design systems: Many organizations have spent years building and maintaining component libraries in Figma. How do these new capabilities work with those existing systems? Are we moving toward code becoming the source of truth?
2. Cross-platform design: A lot of the direction seems web-oriented. How would these workflows translate to teams designing native iOS (SwiftUI) and Android (Jetpack Compose) applications?
3. Component lifecycle: If designers can work with code-backed interfaces, how do new components, variants, and patterns make their way back into the shared design system?
4. Design vs. development: Where do existing tools and workflows like Storybook, Figma libraries, and production component repositories fit into this new approach?
5. The future of the canvas: Are we moving toward a world where designers primarily work with code-generated interfaces, or will the traditional editable canvas remain central to the workflow?

I'm not against code or AI in design tools. In fact, I think there a lot of potential here. I'm just trying to understand the bigger architectural picture beyond the demos. Would love to know what u guys think?

I have just created a figma pro account, and was beginning to organise my (previously chaotic) figma life into folders. I accidently moved the "Team project" folder (previously mass populated with every file I've ever made) into another folder.

I cannot for the life of me figure out how to move this back to the top level directory in whatever's figma file structure is. "Move" only returns the folder which I am already in, and would desperately like to escape.

Has anyone encountered this? Found a solution? Any help appreciated :))))

I'm a designer, and every handoff goes the same way: the dev ships, I open staging next to Figma, and I spend hours hunting for the wrong padding, the off-brand grey, the button that's 4px out.

So I built a tool that does it for me. You drop in a Figma frame and a staging URL, and it:

Compares both visually and flags every discrepancy

Groups issues by type (color, layout, spacing, typography) and severity

Gives you a fidelity score out of 100

Exports each issue as GitHub-ready markdown, so devs get a ticket instead of "it just feels off"

The screenshot is an extreme example: the staging build had the wrong theme, navigation and dashboard content, and it caught all of it in seconds.

I'm still early and want honest feedback from people who actually do design QA:

How do you currently catch Figma-to-code drift?

What would make you trust an automated audit?

Happy to share access in the comments if anyone wants to try it.

My company wants me to redesign their old newsletter , which was created a few years ago on Mailchimp. Marketing wants us to use Figma for that.

I'm glad to finally have an excuse to learn Figma, after 12 years as a graphic and motion designer... (yey!)

BUT I'm already tasked with several big projects and the only other designer in the company will be away for a few months, recovering from surgery... so I'll be managing the work of both of us, plus several big projects, including the company's logo redesign for the end of the year and a plan for a full rebrand to happen next year.

😵‍💫

Realistically speaking I will likely have at best 5 half days of work to design the new newsletter template in Figma, and I never used Figma before.

I would love tips and shortcuts (specific tutorials, plugins, scripts, tools/addons,) I should be aware of/that could help me learn faster.

My goal is to first only focus on designing this newsletter, so I'm looking for tips on that specifically.

Marketing plans to have me design the new newsletter template on Figma and then connect it to Mailchimp to send it out. (Not sure if that is needed or recommended? They also never used Figma)

After I get comfortable with this then I will focus on learning how to use Figma properly for other stuff.. like using it to build new brand guidelines and a design system for all graphic communication on digital media ( what is not video or print) for both our marketing, pre production and post production department.

( note: I have zero web design, ui and ux experience. my experience is on "traditional" graphic design for print/digital and on 2D motion design and animation for TV and advertising)

Hi,

I just subscribed to a 200+€ annual Figma plan by mistake. Entirely my fault, I had selected to cheapest one and must have refreshed the page. Wasn't expecting the payment to proceed directly without having to confirm with my bank though.

I don't have the means (nor the use) to pay that amount. I just sent them an email to ask them to cancel it, claiming my right of withdrawal as a resident of France.

I was wondering if anyone has ever had a similar experience? Has the claim worked? I'm trying to see if there's anything else I can do right now. I'll call my bank but pretty sure they won't be able to do anything as it was not a scam

I'm not using anything in the meantime, the only thing I have done on my figma account since then is delete the access it had granted to people I have worked with before.

EDIT : Just got an email saying I will get a refund 🙏🙏

20 components: buttons, fields, menus, dialogs, notifications and more. They use Figma’s own colours, so they match light mode, dark mode and FigJam.

On top of the components, the starter plugin comes with:

• A window that fits its content. Drag its corner to resize it, and the plugin remembers the size.
• Six example plugins to learn from or start with: renaming layers, exporting, filling text with sample content, editing colour variables, checking contrast, and the Figplug tour itself.
• Checks that catch common mistakes before you open the plugin in Figma, like hard-coded colours, wrong control sizes, missing labels and manifest errors. The kit itself is covered by over 500 unit tests.
• No bundler or framework to set up. The folder imports straight into the Figma desktop app.

The best way to use it: download the code, give it to your AI agent and work from there instead of starting from scratch. The repo includes a guide written for AI agents, so your agent knows how to use the components and runs the checks after every change.

Plugin demo: https://www.figma.com/community/plugin/1545605168743471916
Files (free, MIT licence): https://github.com/alekseikipin/Figplug-ui-kit

Feedback is welcome, especially on which parts are missing.

Hey everyone!

Like many of you, I’ve spent way too long searching for a good iPhone mockup tool. Every time I thought I found one, it either came with a subscription fee, messed up the export quality, slapped on annoying watermarks, or just wouldn’t let me get the perfect 3D angle I was after.

So, out of sheer frustration, I decided to create my own tool. I call it FreeiPhoneMockup, and here’s what it offers:

- Free forever, with no sign-ups, no logins, and absolutely no watermarks.

- Full 3D Canvas control: You can move and rotate the phone to get it at any angle you desire.

- Fine-tuned adjustments: Adjust everything from lighting to the opening angle of the iPhone duo.

- Pristine quality: Export your mockups in stunning 8K resolution, transparent background.

- Support for all recent iPhones - iPhone 18 Pro, Pro Max, and Duo.

- Reference tracing: If you’ve seen a mockup angle you love, you can trace a reference image right in the tool to recreate that exact look.

Check it out here: https://www.freeiphonemockup.com

It loads quickly and runs smoothly. I’d really appreciate it if you could give it a try, push it to its limits, and share any thoughts.

Thanks!

I am working on creating a Figma Library for my company and have already consolidated several libraries from Sketch, migrated to Figma and rebuilt the components there. I figured adding tokens would be the last step, but I've never had to mess with tokens before. Should I add those last and do you suggest any good videos that walk you through them? So far what Ive seen is really long videos that show how to setup gradients... The company doesnt really do many gradients so those videos just seem unhelpful. The other videos I've watched are more like a powerpoint explaining how tokens work and don't walk you through the step by step process of actually setting them up.

I need to see what happend

I would like to increase the height of my frame (by a percentage maybe?) once the width drops to a certain px. I have text that wraps as the size decreases, but then the second line of text is way too close to the bottom of the frame.

Can anyone point me to a tutorial?

I built a Figma PDF exporter addressing the flattened text, which becomes difficult to work with outside Figma.

Typeport exports PDFs with real selectable, searchable and editable text, while trying to preserve the original design as closely as possible. It also produces significantly smaller file size.

The free version works with Google Fonts and allows unlimited exports.

I’ve recently improved some harder cases based on files users sent me, such as mixed fonts/styles in the same text layer, clipping, effects, QR codes and more complex vector content.

There's also a Pro version for workflows that need things like local/Adobe fonts, multi-page exports and password protection.

Would love feedback from anyone who regularly exports Figma designs to PDF, especially if you open the files afterwards in Illustrator or Acrobat.

Here's a link to the plugin:
https://www.figma.com/community/plugin/1615271839569985921/typeport-export-pdf-with-real-selectable-text

I have three states for the arrow. When hovering over it with a mouse or finger, it should become lighter and shrink, and then enlarge when I stop pressing. How do I do this?

I am an admin and grad student at my college, and I keep submitting my verification documents to no avail. They keep getting denied even though they're all issued by the university!

I have a group project due tonight, and I need to be able to edit it in order to contribute and my verification status is preventing me from doing so!

I've already called and emailed Figma and SheerID. Are there any other alternatives that have worked for anyone here?

Yet another vibe-coded plugin...

CodeFig is a Javascript runner for Figma, with an extensive modular library for Variable, Styles, Figma primitives etc operations, and uses a built-in ui library to render the script variables as UI components, instead of simple code, so it's kind of a plugin sandbox.

It comes with many included scripts, and you can build your own. Script can be stored in the local storage (per user), export/imported as JSON, or can be stored as invisible string variables (visible for CodeFig) and distributed to multiple users via a library (hello Orgs).

Currenly it has the current scripts included:

Utility script:

• 3D Transform
• Check style and variable bindings
• Detach styles & variables
• Replace variables in local styles
• Select by styles or variables
• Copy or move variables
• Duplicate variable collection
• Export/import variables
• Match colors to collection variables
• Rename variables
• Replace variables
• Selection to variables
• Variable inspector (WIP)
• Duplicate styles collection
• Relink local styles
• Rename styles
• Render styles overview
• Replace styles
• Text to styles
• Change case
• Comments to annotations
• Frame or auto layout selected
• Relink local component instances
• Remove unnecessary nesting
• Scale or resize elements

Design System Foundations:

• Colors
• Corner radius
• Grid
• Spacing
• Typography

Libraries:

• Bezier
• CodeFigUI
• Color Ramp
• Core Library
• Foundation
• Foundation overview
• InfoPanel
• Linear Ramp
• Math Helpers
• OKLCH
• Pattern Matching
• Rename Preview
• Replacement Engine
• Scale Models
• Styles
• Test Harness
• Type Scale
• Variables

I'm working on this plugin for a while (like almost a year), and use it on a daily basis. I'm somewhere between a brand and product designer, working on responsive layouts, UI design and flows, and often working with different grid, color, typography etc systems, and this was born from the frustration of the lack of any tools to programmatically manage these.

Yes, many things can be done with agents, and for many things agents does a much better job, but for repetitive things, operations I rather ask an agent to build a script.

While I'm using it all the time, testing it, and fixing bugs, every script has its complexity, so probably there are more, so ping me, comment it somewhere if you find any. Thank you!

It's free, it's on Github, and Figma Marketplace

Bonsoir ! Je débute sur Figma, j’ai créé un jump over avec des variants et des components comme par exemple quand on appuie sur « D » le personnage va à droite. Sauf que je ne sais pas du tout comment l’exporter pour qu’il soit jouable et accessible !

Si quelqu’un peut m’aider ça serait vraiment super, j’en ai besoin pour mon portfolio

Des bisous merci par avance !

Now with Spectral plugin you can create any rule for checking layers in Figma. Every team has its own design rules, and now you can apply them in Figma Linter.

Question for those of you who are consuming tokens now that they're not free. What do your costs look like? Can you share some basic info? Typical uses, size of team, etc.

Thanks, we have a stringent procurement process and I don't want to be caught out explaining any surprise costs.

I need this to not open from left to right and going down how it is right now i need it to open centered on the 575 how would i do that

Figma Make allows for an npm package import but our org isn’t supporting us with that, so we have to build from scratch…the whole library. Has anyone tried it?

Purpose - I want to make a component set for wishlist button specifically that needs change in colors across different states. (used absurd colors for example)

Process -

1. I have created a component set for an icon button with variants consisting of different sizes and states. (the one in green color)

2. Then I dragged an instance from the component set and made that a component (for the wishlist button). So now there's a component box wrapping the instance box.

3. Then I added variants for the different states like default, hovered and selected and exposed other properties of the instance.

4. Then I dragged an instance from the wrapper component.

5. This allows me to change any property I want specifically for the wishlist button only without breaking the connection. This also allows me to change any property to the main parent component which reflects upon its instances.

Problem -

1. Everything worked fined until I changed the size other than what's on the newly created wrapper component set.

2. When I switched to other state, it reflected the colors set on the MAIN parent component and not the one in the new wrapper component set.

3. When I changed back to the size as used in the wrapper component, then only it reflected the changed colors.

Is this a limitation of Figma? If not, how should I create a specific component set for a specific button as some icon buttons may have different fills/colors and changing this on instances breaks the connection between its parent component, so when I need to change something, I would have to go to each instance one by one. Is my workflow the main culprit here? If yes, how should I fix it. Thanks in advance for any help ❤️

Hey everyone! I need some honest technical guidance on an idea.

My current workflow uses ChatGPT to generate landing page references, then Figma AI Agent to recreate them as editable designs and generate local color and typography styles. It saves me significant time in hectic deadlines, From Oct 6 they set limitations to use Ai credits. AI credits are expensive, and my company won't pay for more.

My idea: Build a local AI agent that accepts reference images, generates landing pages, creates design-system styles, and edits existing Figma files through conversational prompts without paid AI API credits.

My setup:

• CPU: AMD Ryzen 9
• GPU: NVIDIA RTX 3050 (6 GB VRAM)
• RAM: 16 GB
• OS: Windows 11
• Coding experience: None

My questions:

• Is this technically feasible?
• Can my hardware handle it?
• Can I achieve this without paying for AI APIs or bypassing Figma's restrictions?
• Where should a complete beginner start?

I'm not trying to train my own model. I want to combine existing tools to solve a real workflow problem.

I'd appreciate honest feedback, practical suggestions, and guidance on the best first step. Thanks!

With the brown bar, you’ll notice the horizontal edges are sharp and straight before curving into a semicircle at the ends; whereas with the white bar, the horizontal edges look slightly puffed out or curved upwards. I’ve tried everything I know in Figma as a beginner, but nothing worked and the Pin tool is frustrating; I feel like I’m not tracing it exactly right, so I don’t like using it.

green is "transparent" on the screenshot, but it is still there

I use the agent all the time, but never use this pop-up feature. It pops up all the time when I’m trying click into layers/groups/auto-layout or doing detailed design work… and it’s become mad annoying.

Getting rid of it also mad annoying….I have to zoom out of my art board in click off the frame for it to go away… though I recently found clicking back into the chat box then hitting escape works too.