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

> Yhdistä Flowstep claude.ai-palveluun mukautetun MCP-yhdistimen avulla.

Claude.ai tukee mukautettuja MCP-yhdistimiä **Integrations**-paneelin kautta.

## Yhdistimen lisääminen

<Steps>
  <Step title="Avaa Integrations">
    Siirry kohtaan **claude.ai → Settings → Integrations**.
  </Step>

  <Step title="Lisää mukautettu yhdistin">
    Napsauta **Add More** (tai **Custom Connector**) ja kirjoita:

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

  <Step title="Todenna">
    Claude.ai ohjaa selaimesi osoitteeseen `https://api.flowstep.ai/oauth/authorize`. Kirjaudu Flowstep-tunnuksillasi (sähköposti/salasana tai Google SSO). Sivu ohjaa sinut automaattisesti takaisin claude.ai-palveluun.
  </Step>

  <Step title="Ota yhdistin käyttöön">
    Palaa kohtaan Integrations ja varmista, että Flowstep-yhdistin näkyy yhdistettynä. Ota se käyttöön keskusteluissa, joissa haluat käyttää sitä.
  </Step>
</Steps>

<Note>
  Tarvitset olemassa olevan Flowstep-tilin todennusta varten. Jos sinulla ei ole sellaista, luo se ensin osoitteessa [app.flowstep.ai](https://app.flowstep.ai) ja palaa sitten tänne viimeistelemään yhdistimen määrityksen.
</Note>

## Yhteyden varmistaminen

Claude.ai-keskustelussa, jossa Flowstep-yhdistin on käytössä:

```
List my Flowstep files
```

## Käyttö

Kun yhteys on muodostettu, kuvaile luonnollisella kielellä, mitä haluat:

```
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 kutsuu Flowstep-työkaluja järjestyksessä ja näyttää renderöidyt kuvat sisäisesti.