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

# Flowstep MCP — Codex

> Connect Flowstep to OpenAI Codex using the Streamable HTTP MCP transport.

## Configuration

Add the server with the Codex CLI:

```bash theme={"system"}
codex mcp add flowstep --url https://api.flowstep.ai/mcp
```

Or edit the config file directly. Use the global file to enable it everywhere, or the project file (trusted projects only) to keep it scoped.

<Tabs>
  <Tab title="Global (~/.codex/config.toml)">
    ```toml theme={"system"}
    [mcp_servers.flowstep]
    url = "https://api.flowstep.ai/mcp"
    ```
  </Tab>

  <Tab title="Project (.codex/config.toml)">
    ```toml theme={"system"}
    [mcp_servers.flowstep]
    url = "https://api.flowstep.ai/mcp"
    ```
  </Tab>
</Tabs>

Codex picks the Streamable HTTP transport automatically when a `url` is set — no transport field needed.

## Authentication

Run:

```bash theme={"system"}
codex mcp login flowstep
```

Codex opens your browser to `https://api.flowstep.ai/oauth/authorize`. Sign in with your Flowstep credentials (email/password or Google SSO). Codex captures the callback and stores the token.

<Note>
  You need a Flowstep account before connecting. Create one at [app.flowstep.ai](https://app.flowstep.ai).
</Note>

## Verify the connection

```bash theme={"system"}
codex mcp list
```

The server should appear with its OAuth status. Inside a Codex session, type `/mcp` to see connected servers, then ask:

```
List my Flowstep files
```

If the tool call succeeds, the connection is working.

## Usage example

```
Create a Flowstep file called "Checkout flow", generate a mobile payment screen
with a card form and an order summary, then show me the rendered image.
```

Codex will call `create-new-design` → `get-screen-image` and display the result.