> ## 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

> Connecta Flowstep a claude.ai usant un connector MCP personalitzat.

Claude.ai permet connectors MCP personalitzats a través del panell Integrations.

## Afegir el connector

<Steps>
  <Step title="Obrir Integrations">
    Ves a **claude.ai → Settings → Integrations**.
  </Step>

  <Step title="Afegir un connector personalitzat">
    Fes clic a **Add More** (o **Custom Connector**) i després introdueix:

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

  <Step title="Autenticació">
    Claude.ai redirigeix el navegador a `https://api.flowstep.ai/oauth/authorize`. Inicia sessió amb el teu compte Flowstep (correu electrònic/contrasenya o Google SSO). La pàgina es redirigeix automàticament a claude.ai.
  </Step>

  <Step title="Habilitar el connector">
    A Integrations, confirma que el connector Flowstep apareix com a connectat. Activa'l per a les converses on vols utilitzar-lo.
  </Step>
</Steps>

<Note>
  Necessites un compte Flowstep existent per autenticar-te. Si no en tens un, crea'n un a [app.flowstep.ai](https://app.flowstep.ai) primer, i després torna aquí per completar la configuració del connector.
</Note>

## Verificar la connexió

En una conversa a claude.ai amb el connector Flowstep habilitat:

```
List my Flowstep files
```

## Ús

Una vegada connectat, descriu el que vols en llenguatge 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.
```

Claude cridarà les eines Flowstep en seqüència i mostrarà les imatges renderitzades en línia.