> For the complete documentation index, see [llms.txt](https://docs.uichemy.com/llms.txt).
> Use it to discover all available pages before exploring further.

# What is Figma to WordPress?

UiChemy Figma to WordPress converts your Figma design into a real, editable page in Elementor, Gutenberg, or Bricks.


UiChemy converts your Figma design into a real, editable WordPress page, in two ways:

### Two Ways to Convert

<Columns cols={2}>
  <Card title="AI Express Mode" icon="sparkles" href="/ai-express-mode/overview/what-is-ai-express-mode">
    Elementor only. AI reads your design and converts it using Composer for a faster, more accurate result with less manual cleanup.
  </Card>
  <Card title="Classic Mode" icon="layers" href="/classic-mode/overview">
    Elementor, Gutenberg, and Bricks. Converts your design into real Elementor widgets, Gutenberg blocks, or Bricks elements, so you can edit them with all the options available in each widget.
  </Card>
</Columns>

Which one should you choose? See [AI Express Mode vs Classic Mode](/introduction/ai-express-vs-classic-mode) for a full side-by-side comparison.

### Open the Figma Plugin

Open the UiChemy Figma plugin for your page builder in the Figma Community.

<Columns cols={3}>
  <Card title="Figma to Elementor" icon="external-link" href="https://www.figma.com/community/plugin/1265873702834050352/figma-to-elementor-uichemy">
    Open the plugin for Elementor.
  </Card>
  <Card title="Figma to Gutenberg" icon="external-link" href="https://www.figma.com/community/plugin/1379733208974981538/figma-to-wordpress-gutenberg-core-blocks-spectra-kadence-nexter-generate-blocks-uichemy">
    Open the plugin for Gutenberg.
  </Card>
  <Card title="Figma to Bricks" icon="external-link" href="https://www.figma.com/community/plugin/1344313361212431142/figma-to-bricks-uichemy">
    Open the plugin for Bricks.
  </Card>
</Columns>

<Callout kind="tip">
Pick the plugin that matches the page builder on your WordPress site. See [How to Install the Figma Plugin](/introduction/install-figma-plugin) for the full setup.
</Callout>

### Which Fits Your Situation?

- **I have a finished Figma file and want it live fast.** Use AI Express Mode, it finishes styling, motion, and responsive layout for you.
- **I need pixel-level control over exactly which widget each layer becomes.** Use Classic Mode's manual tagging.
- **My design needs to work in Gutenberg or Bricks, not just Elementor.** Use Classic Mode, AI Express Mode is Elementor-only today.
- **I'm not sure yet, or want to compare properly first.** See [AI Express Mode vs Classic Mode](/introduction/ai-express-vs-classic-mode).

Once you've picked a mode, each has its own further setup choice, Full Setup vs. Page Only in AI Express Mode, or Direct Import vs. downloading a JSON file in Classic Mode, covered on each mode's own pages.

### Frequently Asked Questions

<ExpandableGroup>
  <Expandable title="Which page builders can I convert to?" default-open="false">
    Classic Mode converts to **Elementor**, **Gutenberg**, and **Bricks**. AI Express Mode converts to **Elementor** today, with Gutenberg and Bricks coming soon.
  </Expandable>

  <Expandable title="Do both modes use the same Credits?" default-open="false">
    Yes. AI Express Mode and Classic Mode draw from one shared UiChemy Credits balance. See [How Do UiChemy Credits Work?](/introduction/understanding-credits).
  </Expandable>

  <Expandable title="Is the converted page editable?" default-open="false">
    Yes. Classic Mode gives you native Elementor widgets, Gutenberg blocks, or Bricks elements. AI Express Mode gives you native, editable [Composer](/uichemy-composer/uichemy-widget/what-is-a-uichemy-widget) sections.
  </Expandable>
</ExpandableGroup>

### Next Steps

<Columns cols={2}>
  <Card title="AI Express Mode vs Classic Mode" href="/introduction/ai-express-vs-classic-mode">
    Not sure which mode fits your project? Compare them side by side.
  </Card>
  <Card title="Set up the WordPress Plugin" href="/introduction/set-up-wordpress-plugin">
    Install and connect UiChemy on your site so you're ready to convert.
  </Card>
</Columns>