> ## Documentation Index
> Fetch the complete documentation index at: https://kb.aampe.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Aampe Surface Creator

> Connect Aampe with all your creative assets in Figma

If your team uses Figma, the [Aampe Surface Creator](https://www.figma.com/community/plugin/1520139378515460963/aampe-surface-creator) plugin can help you quickly extract page components and prepare them for integration.

<iframe width="560" height="315" src="https://www.youtube.com/embed/OHVLei7a6k4?si=J1mzXBRWKQqEFRuB" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen />

Within Figma, select `Actions >  Plugins & Widgets` and find the **Aampe Surface Creator.**

After opening the Aampe Surface Creator, you'll be prompted to sign in to your Aampe account. Sign in and follow the Surface Creator prompts.

* Select your Frame
* Choose which Frame elements you wish to include in your Surface

<img src="https://mintcdn.com/aameo/j0hCYw6vq7TowM1E/images/surfaces-demo-figma1.png?fit=max&auto=format&n=j0hCYw6vq7TowM1E&q=85&s=f1eae83f7081d2d770621a38628a8553" alt="Surfaces Demo Figma1 Pn" title="Surfaces Demo Figma1 Pn" className="mx-auto" style={{ width:"73%" }} width="1322" height="1294" data-path="images/surfaces-demo-figma1.png" />

* After selecting your components and assigning types and names, you can export the list to Aampe in a single click (**Add to Aampe**).

  <img src="https://mintcdn.com/aameo/j0hCYw6vq7TowM1E/images/surfaces-demo-figma2.png?fit=max&auto=format&n=j0hCYw6vq7TowM1E&q=85&s=6efd052d5ea7d6aaabab7ff20d668dcf" alt="Surfaces Demo Figma2 Pn" title="Surfaces Demo Figma2 Pn" className="mx-auto" style={{ width:"77%" }} width="1322" height="1294" data-path="images/surfaces-demo-figma2.png" />

  This will generate a template in Aampe with all the necessary fields, ready for your specific messages and all their variants.

## Aampe Surface Creator (Figma) FAQs

<Accordion title="Can I see my Aampe content within Figma?" icon="sparkles">
  ~~Currently, the Aampe Surface Creator sends only creates a surfaces template within Aampe. It does not pull Aampe content into Figma.~~

  Yes! The Aampe Surface Creator can now push Figma elements into an Aampe template, and also pull content from Aampe to see how it different variants render. 
</Accordion>

<Accordion title="Can we use the Aampe Surface Creator plugin for email templates?" icon="sparkles">
  At the moment, the Aampe Surface Creator only creates templates for surfaces. 
</Accordion>

<Accordion title="Do I need a paid tier of Figma to use the Aampe Surface Creator?" icon="sparkles">
  No. You can use the Aampe Surface Creator on [Figma's free tier](https://www.figma.com/pricing/). 
</Accordion>