November 30, 2025

How to copy figma template using GeminiCLI (MCP)

This content is a solution to all who are confused about how they can copy figma template adequately and how mcp connection can be successfully built.

How to copy figma template using GeminiCLI (MCP)

How to Copy a Figma Template Using Gemini CLI (MCP) — Full Guide

Design automation is becoming easier than ever, thanks to the Gemini CLI and the new MCP (Model Context Protocol). If you want Gemini to read, understand, or recreate a Figma template exactly as it is, the setup is surprisingly simple — you just need to generate a Figma Access Token and connect Figma via MCP.

This guide walks you through:

  1. How to get your Figma Access Token
  2. How to connect Figma to Gemini CLI using MCP
  3. How Gemini can copy or reuse your Figma template

1. Generate Your Figma Access Token (Step-by-Step)

Before Gemini can access or copy anything from Figma, you need an Access Token.

Here’s the clean, complete method:

Step 1: Open Figma in your browser

Go to:

👉 https://www.figma.com

Log in if needed.

Step 2: Open “Settings”

Click your profile picture (top-left) → Settings

Step 3: Scroll to ‘Personal Access Tokens’

Inside Settings, scroll down until you find:

🔑 Personal Access Tokens

Step 4: Click ‘Generate new token’

A pop-up will appear asking for a token name.

You can write anything such as:

  • “Gemini CLI”
  • “MCP Access”
  • “Automation Token”

Step 5: Copy the token immediately

Figma will show something like:

figd_abc123xyz789

⚠️ Figma will NOT show this again.

If you lose it, you must generate a new one.

Step 6: Save it somewhere safe

This token is like a password — never share it publicly.

2. Connect Figma MCP Server in Gemini CLI

Once your token is ready, Gemini CLI must be made aware that Figma is a new MCP server.

This is where your command comes in.

Correct MCP Add Command

gemini mcp add --transport http figma https://mcp.figma.com/mcp --header "Authorization: Bearer figd_abc123xyz789"

Verify the connection

Run:

gemini mcp list

You should see:

✔ figma (connected)

If you want a deeper check:

gemini mcp status figma

3. How Gemini CLI Copies a Figma Template

Once connected, Gemini can now interact with your Figma files through MCP.

What Gemini can do:

  • Read your Figma file structure
  • Extract nodes and layers
  • Generate screenshots
  • Generate code for each component
  • Re-create a template in React, HTML/CSS, Flutter, etc.
  • Make a duplicate version of the same UI

How to request it from Gemini:

Example Prompt for Copying a Template

You can tell Gemini:

Use the Figma MCP server and fetch the entire design from this file:
https://www.figma.com/design/FILE_KEY/MyTemplate?node-id=0-1

Please copy the full template exactly as it is and generate all UI code in React + Tailwind.

Or:

Take the following Figma file and recreate a pixel-perfect version:
https://www.figma.com/design/FILE_KEY/MyDesign?node-id=1-2

Or:

Create a full duplicate of the layout from this node and export all assets.

Gemini will then use MCP to:

  • Fetch node metadata
  • Pull screenshots
  • Generate code
  • Output a new clean template

4. How Copying Works Under the Hood (Simple Explanation)

When you request a template copy, Gemini does the following:

  1. Calls Figma MCP
  2. Fetches node IDs and metadata
  3. Downloads asset URLs
  4. Re-creates visual layout
  5. Generates code or a new design structure

This works without any manual exporting from Figma.

Conclusion

Using Gemini CLI with MCP turns Figma into an automated design engine. You can copy entire templates, replicate layouts, or generate code — all through your terminal.

All you need is:

  • A Figma Access Token
  • The MCP add command
  • A Gemini prompt requesting the template

Once connected, Gemini + Figma becomes a powerful automation workflow for UI developers and designers.

Comments (0)

About the Author

Sahar Fatima

Author

Sahar Fatima is a writer, AI learner, and business graduate from Pakistan. With a passion for creativity and technology, she blends her storytelling skills with emerging AI tools to build digital products, write meaningful content, and explore innovative solutions. As a full-stack developer in progress, she enjoys learning, experimenting, and turning ideas into practical, user-friendly experiences. Driven, curious, and constantly evolving, Sahar continues to grow at the intersection of tech, business, and creativity.