Figma Make not using my library components

Hey ​@Daniel_Leinerud, thanks for reaching out! 

To use an existing design system in Figma Make, you'll need to ensure that your designs are properly set up in frames or as components. Here are the steps you can follow:
 

1. Ensure your design is in a frame or component: Designs you want to attach to Figma Make must be either a component or added to a frame. You can use the Frame tool to create a frame around your design if it's not already in one.
2. Attach your design: Once your design is in a frame, you can attach it to Figma Make. For your reference, I've included a screenshot of what that area would look like (bottom left corner of a Make file). If you encounter any issues, make sure to check that your design is correctly framed.

For more detailed guidance, you can refer to our best practices for attaching designs and images.
 
If you have any more questions or need further assistance, feel free to ask!
 

Daniel, I’m having the same problem. Even when I attach a design that is using the components it doesn’t work. 

Honestly so far it is fast to design than to use Figma Make and the code it generates is not what our design system using at all.

Hi ​@Gayani_S and team, is there a roadmap that includes the ability to replace and/or augment the initial shadcn component files? For instance, an ability to upload a ZIP of accurate component files that still use React, but aren’t shadcn.

Or is there a plan to allow for a more direct connection to design system code rather than the translation to shadcn components that currently happens when onboarding a library?

I am also having trouble with figma make using the ui library. I did a prototype before tht worked really well wiht no ui library attached, but now that I am using a library, it is using random elements. I am pasting a frame of my designs and everything uses auto-layout and components from Radix UI library

Hi ​Patrick, thanks for the feedback and apologies for the delayed reply! 

I’ll pass these requests onto our Figma Make team for future consideration, but there’s no exact timeline we can provide right now. 

Hi Daniela, thanks for reaching out! 

I completely understand how frustrating it must be that your library isn’t being properly reference by Figma Make. 

May I ask if this is happening with an entirely new Figma Make file? Or are you reiterating a new Figma Make from the previous Figma Make file you used to make the working prototype. I only ask, because it’s recommend to always start with a new, fresh Figma Make file. 

That said, to ensure you’re adding your Figma library correctly, be sure to:

1. Export your library from Figma Design
   This gives Figma Make access to your existing styles and components.

2. Select the library inside your Figma Make file
   Once you’ve linked the library, Figma Make will pull in the styling CSS automatically. From there, you can refine things further—edit the imported styles, or add design guidelines to fine-tune how those styles are used in your prototype.

More step-by-step information is available here: https://help.figma.com/hc/en-us/articles/33024539096471-Bring-style-context-from-a-Figma-Design-library-into-Figma-Make 

So I'm having the same issue, and I've imported my library into make.

Granted I didn't attach any designs (I wanted to see if it could quickly whip up a settings page from prompt), but even the buttons and switches didn't use the library components. It just created new ones that 'looked' like my components.

After copying the make design back into my project, I had to go through and replace each one generated with the actual component my library uses.

I have the same Issues. I started troubleshooting together with the Figma Make AI and here is the Issue Figma Make has (in its own words): 

 

If you explicitly connected the "MUP Design Library" when setting up this project, I should be able to see your:

• Component variants
• Design tokens/variables
• Color styles
• Typography styles
• Spacing systems

But I cannot see any of that library information. I can only see:

• The files you've created in this project (`/App.tsx`, `/styles/globals.css`, etc.)
• The code I generate
• Nothing about the connected MUP library

This Sounds Like a Gap in Figma Make

Could you investigate that? If you need further Information, let me know.
 

I am having the same issues, my library is connected and imported, but it’s not using my components. They are properly labeled etc. It can not find variants of my components either and even asks me to import them again. It started off by not using any of my components in the design and completely freestyling except for font and color.

When I import the entire design library into Figma Make, only the base Button component is being generated in the `/imports/` folder. The different component states (particularly Hover and Focus states) are not being exported. And can’t seem to be accessed by make. 

From my make:
“You’re right that I should have access to the design system! Let me look more carefully. Are there more files in the imports folder that aren’t visible, or is the hover state defined somewhere else?

Right now I only see /imports/Buttons.tsx, which seems to contain a single Button component. Could you import all the Button variants from Figma (including the hover state) so that I have access to them? Or are they already somewhere and I’ve just missed them?”
 

same issues as above - got a better overall result without using my library so there is no point in having the feature if it does not read the components either in the design linked or in the library linked