> ## 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 — claude.ai

> Conecte Flowstep ao claude.ai usando um conector MCP personalizado.

O claude.ai oferece suporte a conectores MCP personalizados por meio do painel de Integrações.

## Adicionar o conector

<Steps>
  <Step title="Open Integrations">
    Vá para **claude.ai → Settings → Integrations**.
  </Step>

  <Step title="Add a custom connector">
    Clique em **Add More** (ou **Custom Connector**) e digite:

    ```
    https://api.flowstep.ai/mcp
    ```
  </Step>

  <Step title="Authenticate">
    O claude.ai redireciona seu navegador para `https://api.flowstep.ai/oauth/authorize`. Faça login com sua conta Flowstep (email/senha ou Google SSO). A página redireciona automaticamente para o claude.ai.
  </Step>

  <Step title="Enable the connector">
    De volta em Integrações, confirme que o conector Flowstep aparece como conectado. Ative-o para as conversas em que você deseja usá-lo.
  </Step>
</Steps>

<Note>
  Você precisa de uma conta Flowstep existente para se autenticar. Se não tiver uma, crie em [app.flowstep.ai](https://app.flowstep.ai) primeiro e depois volte aqui para concluir a configuração do conector.
</Note>

## Verificar a conexão

Em uma conversa no claude.ai com o conector Flowstep ativado:

```
List my Flowstep files
```

## Uso

Depois de conectado, descreva o que você quer em linguagem natural:

```
Create a Flowstep file called "Checkout flow" and generate a three-step checkout screen
for an e-commerce app: cart review, address entry, and payment. Show me each screen.
```

O Claude chamará as ferramentas Flowstep em sequência e exibirá as imagens renderizadas inseridas no texto.