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

# Where do I start?

Compare the four ways to start with UiChemy and pick the one that fits what you already have.


UiChemy gives you four ways to start. The right one depends on what you already
have. Here's each one and what it's best for.

## Start with a Figma design

You have a design file and want it in WordPress. UiChemy has a Figma plugin for
each builder.

<Columns cols={3}>
  <Card title="Figma to Elementor" icon="figma" href="/ai-express-mode/overview/what-is-ai-express-mode">
    Two modes to choose from, see below.
  </Card>
  <Card title="Figma to Gutenberg" icon="figma" href="/classic-mode/figma-to-gutenberg">
    Your design becomes editable blocks in Gutenberg.
  </Card>
  <Card title="Figma to Bricks" icon="figma" href="/classic-mode/figma-to-bricks">
    Your design becomes native Bricks elements.
  </Card>
</Columns>

### If you're building in Elementor

The Figma to Elementor plugin is the only one with two modes.

<Columns cols={2}>
  <Card title="AI Express Mode" icon="sparkles" href="/ai-express-mode/overview/what-is-ai-express-mode">
    AI finishes the conversion for you: motion, hover, responsive states, and
    global styles applied automatically. Your design lands as a Composer.
  </Card>
  <Card title="Classic Mode" icon="layers" href="/classic-mode/overview">
    Full manual control over tagging and conversion settings.
  </Card>
</Columns>

<Callout kind="tip">
Torn between the two? See [AI Express Mode vs Classic Mode](/introduction/ai-express-vs-classic-mode)
for a direct comparison.
</Callout>

## Start with a client brief or idea

You know what the site should do, but nothing is designed yet.

<Card title="AI Website Creator" icon="lightbulb" href="/ai-website-creator/overview/what-is-ai-website-creator" horizontal={true} cta="Start with an idea">
  Describe your idea in a sentence or two. UiChemy builds a project scope, a
  sitemap, and a design for every page, and you review and adjust at each stage.
  Exports to Elementor or Gutenberg.
</Card>

## Start with an AI tool

You already build in Claude, Cursor, Codex, or Antigravity, and you would rather
stay there.

<Card title="AI to WordPress" icon="bot" href="/ai-to-wordpress" horizontal={true} cta="Connect your AI tool">
  Connect your AI tool to UiChemy once, then create and edit real pages on your
  site from that tool. No copying markup back and forth.
</Card>

## Start in your builder

You want to build the page yourself, directly in your builder.

<Card title="Composer" icon="blocks" href="/uichemy-composer/getting-started/what-is-uichemy-composer" horizontal={true} cta="Open the Composer">
  Composer is a widget, not a separate editor. Add it to a page from your
  builder's widget panel, then describe what you want and AI writes the HTML,
  CSS, and JS. You can also edit the code yourself.
</Card>

## What they all have in common

<Card title="Native, editable output" icon="check" href="/uichemy-composer/getting-started/what-is-uichemy-composer" horizontal={true} cta="Explore Composer">
  However you start, you get native, editable output inside your builder, never a
  flat export or a locked image. On Elementor your work becomes a Composer. On
  Gutenberg and Bricks it becomes real blocks and elements.
</Card>

<Callout kind="info">
New to UiChemy? The [Quick Start](/quickstart) covers the one-time setup all four
options share.
</Callout>