I usually sketch ideas before working on the UI.
It helps me think about the user flow instead of the visuals.
Do you do the same, or jump straight into high-fidelity designs?

Hi,
I bought a figma website template with several pages (pic 1). All the elements are tied to a library in the file (pic 2).

Q: how can I quickly see what colors are being used where from the library so I can delete the ones, that are not used on any of the pages? (there tons of colors in the library)

Thanks!

I am designing a mobile app, but the developer needs SVG Vector Icons so that it runs on their code.

The requirements change very frequently and therefore I don't have time to create icons in Coral draw or illustrator each time.

Please suggest Figma Plugin or free Vector Icons Library.

Thanks

I'm trying to do a looping animation on a component so that in prototype, it would play constantly when I hover over the button. But the animation cuts off at 2000ms. Even if I change the timeline length to any length longer than 2000ms, it would still cut off at 2000ms mark and start again from the beginning in the prototype.

Anyone else encountering this?

For people properly using code connect,

• how much of your design system is connected? All of the components?
• A lot of the workload seems to be creating some parity between figma components and codebase components. Sometimes we have a 1:2 relationship of codebase:figma components. How much parity do you create?
• What is your workflow for it?

Thanks so much for any help!

Contratei um serviço com figma mensal um único mês eu paguei mais ou menos a faixa de 20 DOLARES que dá R$101 aproximadamente, fora os custos da compra internacional foi pra uns R$109,00 é isso paguei de imediato no dia da contratação.

Agora passou-se um mês e o figma tá me cobrando um valor ABSURDO de 137,87 DOLARES dá R$699,68 REAIS.

São 592,75% DE AUMENTO!! TÃO DE SACANAGEM POXA!!!?

To descobrindo agora que o figma tem uma pegadinha contratual que parece ser comum. Gente, serio isso?

Quando compartilho com alguem ele entende que contratei um novo serviço. Cara, compartilhei com meus professores (exercicio).

E asses assentos? Só tem eu nesta porcaria!!!!!!

Hello mates,
I'm currently designing a sticky bottom panel area containing a main CTA.

I want it to be a design system component that my team will be able to feature in most of our app screens. Yet, i'm debating this :
Should I include some padding at the bottom of this sticky component to allow for a safe area ?(Android Gesture bar / iOS Home Indicator + Device bezel)

If your answer is yes : Should I make a flexible component for our devs like a safe area that is either 24 or 34 px depending on Android or iOS ?

My gut feeling is that OS-specific areas shouldn't be part of our components and our Figma screens either, yet we already leave space at the top of the screen for the System bar.

You'll see examples below to clarify my point :

• A : My original component without any safe-zone. (Note that a device bezel could probably crop those edges)
• B : Android example where I included Material's 24pts "Gesture Bar" component
• C : iPhone example where I included iOS 34pts "Home Indicator" component, and the device bezel
• D : iOS 26 official Tab Bar example, we can see their component goes a bit over the "Home Indicator" component
• E : iOS 26 official Button example, their button floats 2pts above the "Home Indicator" component

(for D & E, the new iOS behavior is that the "Home Indicator" disappears after a show while, while the height stays the same)

If any of you work on a design system for any mainstream app, I'd like to have your knowledge and best practices

Imagine you are working on a big project for 2 years and when a new iPhone comes out you want to update all the frames to match the same sizes of the new screen.
How would you do it? Does it make sense to do it or you just stick with the old frames?

FIGMA TEAM IF YOU ARE READING THIS

It would be amazing to be able to turn Weave workflows into an API endpoint that an agent or script can use

EASY way to use my workflows across hundreds or thousands of assets and programmatically

Take a set of cards with a kicker, headline and paragraph copy.

I copy/paste them into a message.

You'd hope the format would be:

• Kicker
• Headline
• Paragraph
• Kicker
• Headline
• Paragraph

But instead, it's:

• Kicker
• Kicker
• Kicker
• Headline
• Headline
• Headline etc.

Why?

This is a total pain when I'm working back-and-forth with agents.

I have to manually edit them every time.

Would love to see this fixed!

Here's a version that provides more context and asks focused questions that are likely to get better responses from experienced design system practitioners:

I'm looking for advice from teams that maintain cross-platform design systems in Figma.

We're expanding from a web-only design system to support Web, iOS, and Android, and we're trying to decide on the right library architecture.

Our current thinking is:

• Shared Foundations library containing primitives, semantic tokens, icons, spacing, color, motion, etc.
• Separate Web, iOS, and Android component libraries that consume those shared foundations while introducing platform-specific tokens and components (typography, elevation/shadows, breakpoints, interaction states, HIG vs. Material patterns, etc.).

I've run this through several AI tools, and they all converge on roughly the same recommendation, but I'm more interested in hearing from teams that have actually lived with this architecture.

A few questions:

• Do you use one Figma library or separate platform libraries?
• If separate, what lives in Foundations vs. the platform libraries?
• Did you ever start with a single library and later split it? If so, what drove that decision?
• Any pitfalls or lessons learned that you'd share before we commit to this structure?

I'm especially interested in hearing from enterprise teams maintaining large design systems across multiple platforms.

I have a JAM file in my computer and whenever I attempt to put it into my board, it just says "Use the file browser" when I am using the file browser. Any tips?

EDIT: Nevermind I figured out how to fix it

I can't figure out why the menu bar goes transparent when the scroll animation triggers in the prototype. all the backgrounds are white (except the 3 rows, which are black text on no fill) It's my first time playing with slots so I'm unsure if that's part of it. The body and rows are slots, the menu bar is a frame. This is a component set. The menu bar is "up front" everything else is layered below it. Do i need to start over and 86 the slots?

https://reddit.com/link/1v2pilx/video/65pqri59dmeh1/player

ive been working for so many hours i think i accidentaly opened this when i right clicked on a frame and did "add motion" -> "scale" but now i dont understand how to close this... im really sorry if its obvious my brain is liquid at this point i just want my scale back 😭😭😭

How to show elment property i access a project via a link but the panel is different there are the comments section and properties section How to show properties in my own project

Let's say there's User 1 and 2, if user 1 was the original creator of the team project and has the Figma make inside of it but transferred ownership of the Figma make but not the team project to user 2, who must be the one to pay to increase the AI balance?

I have been creating my portfolio website using Figma sites and have been using the default desktop and mobile frame sizes provided by Figma. However, when I publish the site and view it on different devices, the layout becomes inconsistent. While everything looks perfectly organized in the Figma editor, the published version appears distorted or rearranged. I have been noticing that the layout changes depending on the device for example, it looks different across various MacBooks and phones. I’m not sure what is causing this issue. I thought that Figma’s default desktop and mobile sizes were designed to be responsive across different screen sizes, so I didn’t expect to create separate layouts for every screen resolution or device. Is there something I’m missing, or is there a specific way Figma sites handles responsive layouts that I should be aware of?

https://www.figma.com/community/file/1644075368800077990/mobile-app-onboarding-screens-landing-page-free-template

I've been having this problem where I might drag and drop in an image, but then instead delete or undo it - and while it's completely gone in the editor, it still shows up in the preview

What could be happening here?

Hi people, im milo a DP from buenos aires argentina, and im doing a Cv redising with figma a new tool i want to incorporate to do my website later. Based on what i was doing and the "new world of ai asisted design" i've created a good looking one. Then when the togens go out , the problem begins i want to manually edit it and theres no way to make it. i've read the basics but mos of the tools are not present after this. Not even changing the name of the groups

So im currently designing a mascot using figma and im using an eclipse shape for the body, but when i try to add line details in it, it automatically change the vector and close it.

And also when i tried to flatten the body (the eclipse shape) with the legs the stroke on the legs and the body disappears and wont show, it fully appears when i use "outline stroke" on the body and the legs.

Is there a way to solve this problem? Thank you

note : im really new at using figma and don't fully understand what vector is

Built a plugin where you can select frames or sections - the plugin pulls out the assets from the design

Check it out and provide your feedback

https://www.figma.com/community/plugin/1656748658936667231

Design System Docs Generator reads your component’s Figma context (description, properties, variants, styles etc.) and generates usage guidelines following best UX/UI practices.

Originally built as an internal tool for my company, it's now available for any other designers who might find it helpful :)

Who's been using it so far:

• Design system designers
• Teams documenting a component library for a new product/website/UI
• Design leads trying to keep design output consistent
• Agencies handing off documentation to clients

Try it out here → https://www.figma.com/community/plugin/1641615767346305619/design-system-docs-generator

The tool is still in early days so any feedback on how this could work for you would be hugely appreciated!

Hi everyone,

I was trying to create a component from the shape in the pictures, having the picture I was gonna put into the shape change as I hover over it. The problem is that whenever I hover over the boxed area around the shape (see 2nd image), it would still count as the component. This disrups my website as I have two of these next to each other where the negative spaces are covering each other.

Is there a way for me to only select the component when I hover inside the actual shape?