ICYMI, we brought the power of @payloadcms to Figma so you can now ship websites with a built-in backend in Figma Make
Oh and it’s now available to everyone today (!)
Say hello to iPhone Duo presets wherever you design and prototype in Figma
→ Properties panel
→ Prototype settings
→ Figma Make preview device picker
→ Code Layers full screen view
Design & code, finally together on the canvas thanks to Code Layers
→ Turn a design layer into an interactive code layer
→ Capture what's live on your website as a code layer with Chrome Extension
→ Duplicate a code layer to explore multiple directions side by side
→ Drop your prototype into a code layer via Figma MCP
Curious how @harvey makes hundreds of tailored demo videos?
Through Figma’s MCP, agents work directly on the canvas to:
→ Pull in visual context from their brand and motion guidelines designed in Figma
→ Storyboard and animate using Figma Motion, for review and feedback with their team
→ Generate imagery and video with @figmaweave
I had a spec-tacular time at Config India last week announcing @figma's newest product: Figma Specs
Specs are Figma's newest material to bring context into, out of, and across Figma - we started with Markdown import, then made it collaborative, placed it onto the canvas, allowed you to drag anything in / out from the canvas, and made it agent-native.
Excited for you to try it out (and to peep the vid in 👇 )
Specs are here and they can do a lot
→ Create data reports, PRDs, generate hand-off context
→ Bring in outside context with an agent
→ Turn rough ideas into a detailed spec
→ Send it to a coding agent using Figma’s MCP server
→ Build a Code Layer on top and refine
In the world of software design and product, we're seeing exponentially more software. But the usage and utilization of apps? Flat.
Differentiate with design, a point of view, brand, storytelling, "taste" (and all the buzzwords you can think of)
you'll do your best work in a tool that allows you to be whimsical, too!
🔊🔊🔊 — lol i've lost hours building fun stuff like this with code layers…
@figma code layers starting to roll out into open beta TODAY! incredibly excited to see what you'll cook!
Now teams can explore and build code-backed prototypes on the canvas with Code Layers, now in open beta
0:00 Intro
0:43 Starting from code
2:26 Explore code concepts on the canvas
3:57 Edit in both code and design
6:36 Merge ideas together