Skip to main content

Change colors across your designs with AI

Recolor objects, swap entire palettes, and adjust tones with a prompt—directly in Figma Design. No manual selection of every layer, no exporting to another tool and importing back.

  • AirBnb
  • Atlassian
  • Dropbox
  • Duolingo
  • GitHub
  • Microsoft
  • Netflix
  • The New York Times
  • Pentagram
  • Slack
  • Stripe
  • Zoom

Recolor faster, stay in your design flow

Figma's agent handles the tedious color work so you can focus on getting the palette right, not clicking through every layer.

Side-by-side comparison of a project list UI in light and dark mode, with an AI prompt bubble reading 'Switch this design to dark mode.'Side-by-side comparison of a project list UI in light and dark mode, with an AI prompt bubble reading 'Switch this design to dark mode.'

Edit colors where your design lives

Figma's agent works as an AI color changer right on your canvas. Describe the color shift you want—warmer tones, brand palette, dark mode—and see it applied to your actual layers without leaving your file.

Figma canvas with a 'My projects' screen in light and dark mode side by side, and an AI prompt bar reading 'Make this screen dark mode.'Figma canvas with a 'My projects' screen in light and dark mode side by side, and an AI prompt bar reading 'Make this screen dark mode.'

Cut the busywork, stay in flow

Hand off repetitive recoloring—swapping accent colors across components, adjusting entire frames, converting light to dark—and keep your focus on the design decisions that actually matter.

Color changes happen in the same file your team works in. Everyone sees the updated palette immediately and can build on it right away. No separate exports or version confusion.Color changes happen in the same file your team works in. Everyone sees the updated palette immediately and can build on it right away. No separate exports or version confusion.

Keep your team in sync

Color changes happen in the same file your team works in. Everyone sees the updated palette immediately and can build on it right away. No separate exports or version confusion.

The features behind the agent

A closer look at what sets Figma's agent apart, built for the way design teams actually work.

  • Screenshot showing Figma AI agent connected to a component library, auto-applying brand tokens to a designScreenshot showing Figma AI agent connected to a component library, auto-applying brand tokens to a design

    Connect to a design library

    Generate and refine using your actual components, tokens, and variables—not placeholder UI you'll have to swap out later.

  • Screenshot of multiple simultaneous AI design prompts running in FigmaScreenshot of multiple simultaneous AI design prompts running in Figma

    Parallel prompting

    Run multiple prompts at once so you're evaluating directions in parallel, not burning time on each one in sequence.

  • Screenshot of a shared Figma AI conversation thread with design commentsScreenshot of a shared Figma AI conversation thread with design comments

    Shareable threads

    Share a thread and your team sees the full prompt, context, and iteration history behind any design. No separate handoff needed.

  • Screenshot showing Figma AI agent skill options for automating design workflowsScreenshot showing Figma AI agent skill options for automating design workflows

    Skills

    Package your team's workflows and conventions into reusable /commands anyone can run on demand.

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

Notion logo

Get started with Figma's agent

  • Step 1: Open the agent

    Select Agents in the left side rail or hit CMD + Enter. Add a frame to the canvas if you want a starting point to work in.

  • Step 2: Describe what you need

    Type your prompt—a layout, a variation, a bulk edit. Point the agent to your design library so it uses your real components and styles.

  • Step 3: Review on the canvas

    Check the output directly on your canvas. Refine in the same thread or start a parallel one to explore a different direction.

  • Step 4: Keep iterating

    Prompt again until the result is right, or fine-tune by hand. Turn repeated workflows into reusable skills for next time.

Become an agent expert

  • The Figma design agent is here

    Watch Figma's AI Agent in action and see how to put it to work in your own workflows.

    Read more
  • Figma agent playground intro screen with a 'Start' button and a sample chat prompt: 'Hey Figma, can you create different layouts for my reading app?Figma agent playground intro screen with a 'Start' button and a sample chat prompt: 'Hey Figma, can you create different layouts for my reading app?

    Work with the Figma agent

    Hands-on playground to explore Figma agent's capabilities — from bulk edits to feedback implementation — with step-by-step guidance built right in.

    Get started
  • How to use Figma agent in your design workflows

    Learn how to use Figma agent in your design workflows with a step-by-step tutorial from the Figma team.

    Watch now

FAQ

Figma's agent generates vector graphics directly on your design canvas. You describe what you need—icons, illustrations, UI elements—and the agent creates scalable, editable vectors using your design system's styles and colors. Everything stays in your file, ready to refine or use immediately.

Yes. Figma's agent creates vector images from text prompts right in Figma Design. The output is fully editable—you can adjust paths, colors, and shapes just like any other vector in your file. There's no conversion step or separate tool required.

Yes. Figma's agent can resize batches of images to consistent dimensions based on your prompt. Select your images, describe the target size or aspect ratio, and the agent applies the change across all of them. The resized images remain editable on your canvas, so you can make further adjustments if needed.

Figma's agent references your connected design library when generating vectors. This means outputs use your actual colors, styles, and tokens from the start. You spend less time restyling generic assets to match your brand and more time designing.

Figma's agent is available on all paid Figma plans. You'll find it in the left side rail in Figma Design, or open it with CMD + Enter. 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.