Gideon AwolesiWhere code layers came from
Figma first announced code layers with Figma Sites on 7 May 2025, as a way to add interactive code to a website you design in Figma. In Sites, they're meant for one-off interactions, and code components are the reusable version.
On 24 June 2026, Figma introduced code layers in Figma Design itself, so interactive code becomes part of the canvas you already design on. Figma said they'd roll out in closed beta over the following weeks, with a sign-up for early access.
How they work
You can start a code layer from a frame you've already designed, ask Figma's agent to write one, bring one over from Figma Make, or import code from a GitHub repository or a local folder. Figma also says you can pull flows and states back out into normal design layers, and push changes back to the repository.
What it could change for handoff
Figma's announcements don't talk about handoff or Dev Mode. This part is my own reading. If a code layer can come from your repository and go back to it, the design file and the code stop being two separate versions of the same screen, at least for the parts built that way. That's the gap I spend a lot of my time closing by hand, so it's the part I'm watching.
It won't replace Code Connect for a design system. Code Connect maps your existing Figma components to your existing code components, so agents and developers reuse what you have. Code layers are for putting working code on the canvas. You'll likely use both.
What's still unclear
Figma hasn't said which plans will get code layers in Figma Design, or when the beta opens up. Until it does, I wouldn't plan a workflow around them. I'd sign up for early access, try them on one flow, and see how the round trip with your repository holds up with your own code.