Skip to main content

​
Overview

The Figma integration enables you to:
  • Generate CMS pages directly from high-fidelity Figma designs
  • Start from creative briefs or wireframes to scaffold CMS content
  • Automatically detect and reuse assets from your DAM
  • Preview live page output from imported designs
This integration eliminates redundant back-and-forth between designers, developers, and content authors by converting designs into live CMS structures.

​
What You Can Do

CapabilityDescription
CMS page generationConvert full-page Figma layouts into editable CMS pages
Creative brief parsingUse wireframes or annotated frames to scaffold content
Asset reuse detectionIdentify and reuse existing assets from your DAM
Preview supportRender real-time previews of pages based on Figma files

​
Setup Instructions

​
1. Generate a Figma Personal Access Token

To authenticate your Figma account with Gradial, you’ll need to generate a personal access token:
  1. Go to Figma Developer Settings
  2. Under “Personal Access Tokens”, click Generate new token
  3. Copy the generated token
Keep this token secure. It will be used to authorize Gradial to access your Figma projects.

​
2. Connect Figma in Gradial

  1. In Gradial, go to Settings → Integrations → Figma
  2. Paste your personal access token
  3. Click Connect
Gradial will now be able to access your Figma files for import.

​
3. Import a Figma File

To generate a CMS page from a Figma design:
  1. Create a new page in Gradial
  2. Select Import from Figma
  3. Enter the Figma file URL or choose a file from the linked account
  4. Gradial will parse frames, text, and images into structured CMS blocks

​
Troubleshooting

Figma file not accessible
Ensure the file is shared with the account tied to your token, and that the token is active.

​
Support

Need help configuring troubleshooting the integration? Contact your Gradial onboarding lead or email [email protected].