Connect a design library
Point the agent to your design library and it generates landing pages using your real components, color tokens, and type styles—not generic placeholders.
Generate landing pages with an AI agent
Describe the landing page you need and Figma's agent builds it directly on your canvas—using your real components, styles, and design system. No starting from scratch, no rebuilding from a separate tool.
Explore more directions, faster
Figma's agent generates real landing page layouts on your canvas, so you can evaluate options in context and move forward with confidence.
Explore more in higher fidelity
Generate multiple landing page variations using your actual design system—real components, tokens, and styles—so you're reviewing production-ready options, not placeholder layouts you'll have to rebuild later.
Cut the busywork, stay in flow
Skip the repetitive scaffolding of hero sections, feature grids, and CTAs. Describe what you need once and let the agent handle the structure while you focus on the creative decisions that matter.
Align your team from the start
Every generated layout lives in your shared file with full prompt history visible. Your team sees the thinking behind each direction and can build on it immediately—no handoff, no lost context.
The features behind the pages
A closer look at what sets Figma's agent apart, built for the way design teams actually work.
Run prompts in parallel
Explore multiple landing page directions at once. Generate a bold hero variation while testing a minimal layout in another thread—all simultaneously.
Shareable threads
Share a thread and your team sees the full prompt, context, and iteration history. Everyone understands the rationale without a separate walkthrough.
Package workflows as skills
Turn your best landing page prompts into reusable skills. Run them with a single command to scaffold new pages consistently across projects.
Figma feels like a natural extension of my hand. I do my design ideation on the canvas, and now the agent takes it the last mile. With my design libraries connected, I can move from design to code faster than ever before.
Andy Madrick
Product Designer, Notion
Get started with Figma's agent
Open the agent
Select Agents in the left side rail or hit CMD + Enter. Add a frame to your canvas where you want the landing page to appear.
Describe your landing page
Tell the agent what you need—a SaaS product page, an event signup, a feature announcement. Point it to your design library so it uses your real components.
Review on the canvas
Check the generated layout in context. Refine in the same thread or start a parallel one to explore a completely different direction.
Keep iterating
Prompt again to adjust sections, swap components, or try new copy. Everything stays editable so you can fine-tune by hand or keep prompting.
Become an agent expert
The Figma design agent is here
Read moreWatch Figma's AI Agent in action and see how to put it to work in your own workflows.
Work with the Figma agent
Get startedHands-on playground to explore Figma agent's capabilities — from bulk edits to feedback implementation — with step-by-step guidance built right in.
How to use Figma agent in your design workflows
Watch nowLearn how to use Figma agent in your design workflows with a step-by-step tutorial from the Figma team.
FAQ
An AI landing page agent generates complete page layouts from a text description. Figma's agent works directly on your design canvas, building real layouts with your components and styles rather than producing static mockups you'd need to recreate. You describe what you need, review the output, and refine until it's ready.
You describe the landing page you want—its purpose, structure, or specific sections—and the agent builds it on your canvas using your connected design library. It references your real components, color tokens, and type styles, so the output matches your design system from the start.
Most landing page layouts generate in under a minute. You can run multiple prompts in parallel to explore different directions simultaneously, which means you're reviewing several options while a single manual layout would still be in progress.
The agent focuses on layout and visual structure, not SEO optimization. However, because it generates editable text layers and components, you can refine copy, headings, and metadata directly in Figma before handoff. The structure is a starting point you control completely.
Figma's agent is available on all paid Figma plans. You'll find it in the left navigation bar in Figma Design. During the current open beta, it doesn't consume AI credits—so it's a good time to explore, experiment, and share your feedback with us.
Build faster with Figma's agent