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

# Servidor MCP Flowstep

> Use o Flowstep como um servidor MCP para gerar, inspecionar e gerenciar designs de UI diretamente do Cursor, Claude Code ou qualquer cliente compatível com MCP.

O Flowstep expõe suas ferramentas de design sobre o [Model Context Protocol](https://modelcontextprotocol.io/), permitindo que seu assistente AI crie e itere sobre telas de UI sem deixar seu editor.

O servidor está hospedado em `https://api.flowstep.ai/mcp` (transporte HTTP Streamable). Nenhum processo local para executar.

## O que você pode fazer

O servidor expõe 20 ferramentas em sete categorias:

| Categoria         | Ferramentas                                                                                   |
| ----------------- | --------------------------------------------------------------------------------------------- |
| **Arquivos**      | `create-file`, `list-files`, `get-file`, `update-file`, `delete-file`                         |
| **Telas**         | `list-screens`, `get-screen`, `get-screen-image`, `add-screen`                                |
| **Geração de IA** | `create-new-design`, `regenerate-design`, `expand-design`, `edit-design`, `upload-attachment` |
| **Chat**          | `get-chat-history`                                                                            |
| **Design**        | `get-design-guidelines`, `update-design-guidelines`, `delete-design-guidelines`               |
| **Figma**         | `import-figma`                                                                                |
| **Cobrança**      | `get-plan-details`                                                                            |

## Casos de uso comuns

**Gere telas a partir de um prompt** — chame `create-new-design` com uma descrição. Flowstep cria o arquivo e telas em uma etapa. Chame `get-screen-image` com os `screenIds` retornados para ver o resultado em linha.

**Visualize um componente React** — carregue seu arquivo `.jsx` ou `.tsx` via `upload-attachment` (use `mimeType: text/javascript`), depois passe o attachment retornado para `create-new-design` com uma mensagem descrevendo o componente. Flowstep lê a fonte e gera uma tela de design correspondente.

**Itere em um design** — chame `edit-design` com um `screenId` de destino e instruções para modificá-lo, ou `regenerate-design` para refazer uma tela do zero.

**Mantenha diretrizes de design** — chame `get-design-guidelines` para recuperar suas regras de estilo atuais (cores, tipografia, espaçamento, tom), depois use `update-design-guidelines` para mantê-las sincronizadas conforme seu design evolui. Passar diretrizes consistentes para `create-new-design` ou `edit-design` garante que cada tela gerada fique dentro da marca. Use `delete-design-guidelines` para resetar completamente.

**Importe do Figma** — chame `import-figma` com um link de frame Figma e um `fileId` para trazer o frame para um arquivo Flowstep como elementos editáveis. A organização do arquivo deve ter Figma conectado primeiro.

**Auditar cota** — chame `get-plan-details` para ver o uso diário e mensal restante antes de iniciar um lote de gerações.

## Endpoint

```
https://api.flowstep.ai/mcp
```

Transporte: HTTP Streamable. Modelo de sessão: stateless (cada requisição é independente, sem ID de sessão).

## Próximos passos

<CardGroup cols={2}>
  <Card title="Início rápido" icon="bolt" href="/pt-BR/mcp/quickstart">
    Primeira chamada de ferramenta em menos de 5 minutos com Cursor.
  </Card>

  <Card title="Autenticação" icon="lock" href="/pt-BR/mcp/authentication">
    Como funciona OAuth 2.1 PKCE e como tokens são emitidos.
  </Card>

  <Card title="Ferramentas" icon="wrench" href="/pt-BR/mcp/tools">
    Referência completa de entrada/saída para todas as 20 ferramentas.
  </Card>

  <Card title="Exemplos" icon="code" href="/pt-BR/mcp/examples">
    Fluxos de trabalho completos para tarefas comuns.
  </Card>
</CardGroup>