Code Connect not showing preview?

Hi, I have the same issue - I’ve connected a simple badge component to a file in github. When I ask figma through the MCP in claude code via the selection, it can detect the connection successfully and says where the file is located

I’m also experiencing the same thing

 

I faced the same problem? anyone here can help us?

Hey All, thanks for flagging this issue! 

I appreciate the detailed descriptions and the screenshots you’ve provided. With a few more details, I can try to pin point the issue and get you connected with our Technical quality team.

Can any of you confirm if the issue is happening only in the one file you’ve shared or for all of your files?
 

I am having this same issue. I’m seeing any new components I try to connect it doesn’t show MCP preview. I paste the exact github component URL and nothing generates code wise. I noticed the components I originally connected using the manual code connect method in the codebase are coming through via MCP and showing the code preview.

Thanks for chiming in here, ​@Lindsey_Drennan! 

As I mentioned above, with a few more details, I can help get you connected with our Technical quality team. Are you using the desktop or the remote MCP server? Is this issue happening in only this file or for all of your files?

If it’s only this file, are you able to share a URL link here and add support-share@figma.com as a Viewer to the file?

​@djv I just added them to my file! Yes it’s our component file, and you can take a look at content section components, tried connecting a good bit of them and nothing works except a few that I already initially connected before the structure change of how you can do code connect. https://www.figma.com/design/SLlE2j1LV7fGSiJF02JpEO/FDS-Website---Brand-Components?node-id=237-457&t=4voduupwjLIO6zXh-1

Thanks, ​@Lindsey_Drennan! 

I’ve created ticket #1744234 on your behalf to connect you with our technical quality team. They’ll take a closer look at your file and follow up directly with you via email. 

If you have any further questions, please reply directly to support via email. 

This issue is happening in our design system as well

Sorry for the delayed response, I eventually got it working and I think it was down to not inputting some of the commands correctly. I had some issues with versioning too, but eventually managed to get this resolved and it began showing the preview. ​​​​​​

Mine still do not work. The only ones that show the code are ones I had previously connected via the manual way using Code Connect CLI

I should probably mention, I’ve not connected any custom components, but mainly run through the ‘demo’ setup. So I’ve probably not encountered the issues you’re running into! 

Hi ​@Lindsey_Drennan, sorry to hear it still isn’t working for you! 

It looks like Caroline replied to you yesterday, and our Technical Quality team will be in touch as soon as they can to continue troubleshooting. 

​@Adam_Gordon - Glad to hear you got it working! Please feel free to let us know if you run into any further issues.

Do we have to be connect to Github to see the “generated MCP preview code”? I’m trying to follow the code connect docs to manually insert the path. I’m not seeing the MCP preview code.

“You can connect directly to a GitHub repository, or manually provide component paths and names if you use another version control system.”

• https://help.figma.com/hc/en-us/articles/23920389749655-Code-Connect
   

Thanks!

Hi ​@Bloo, thanks for chiming in here! 
 

No, users do not have to connect GitHub to create a Code Connect mapping. You can manually enter a file path and component name, and that mapping will still be used by the MCP server.
 

Since you’re not seeing the MCP preview code, there are a few things to check:

1. Source access (most common)

• The preview code in Code Connect UI is generated based on connected source files. If you’ve only entered a manual path (without connecting a repo like GitHub), Figma may not be able to access the actual code — which can result in missing or limited previews.

2. Path or component name mismatch

• Make sure:
  • The file path is correct
  • The component name matches the exported code component
    If these don’t align, the preview may not generate as expected.

3. Inspecting the correct component

• Ensure the component you’re viewing in Dev Mode is the same one that’s been connected. Instances or variants that aren’t mapped won’t show connected code.

4. Library + publishing

• Code Connect UI works from published library components. If the component isn’t published, the connection may not fully apply.

5. Plan + seat requirements

• Code Connect requires:
  • Organization or Enterprise plan
  • Dev or Full seat

6. UI vs CLI expectations

• The UI setup provides basic generated snippets. If you’re expecting richer, prop-aware code, that typically requires Code Connect CLI.

Hope this helps you narrow down the issue, but please let me know if you have any further questions.