https://api.flowstep.ai/mcp (transporte Streamable HTTP). Não há nenhum processo local para executar nem nenhuma chave de API para gerir. Os clientes iniciam sessão com a sua conta do Flowstep através de OAuth.
O que pode fazer
O servidor expõe 22 ferramentas em oito categorias:
As três ferramentas de Design com IA usam a mesma quota de mensagens da aplicação Flowstep. Todas as outras ferramentas são gratuitas. Consulte Limites de utilização.
Casos de utilização comuns
Gerar ecrãs a partir de um prompt: chameai-design-screens com uma descrição. Se omitir fileId, o Flowstep cria o ficheiro e os ecrãs num só passo. Chame get-screen-image para cada screenId devolvido, para ver o resultado em linha.
Visualizar um componente React: carregue o seu código .jsx ou .tsx com upload-attachment (mimeType: text/javascript) e, depois, passe o anexo devolvido para ai-design-screens com uma mensagem que descreva o ecrã. O Flowstep lê o código-fonte e gera um design correspondente.
Iterar sobre um design: chame ai-design-screens com um ou mais screenId (ou identificadores de elementos individuais) em elementIds e instruções de texto livre para os alterar no lugar. A mesma chamada também pode adicionar ecrãs novos, por isso um só pedido pode editar um ecrã e criar o seguinte. Use ai-edit-screen-variant para aplicar uma predefinição, como um tema escuro ou um layout diferente, a um ecrã inteiro.
Expandir um fluxo: chame ai-generate-screen-variant para adicionar o ecrã seguinte, um estado de erro ou vazio, ou uma versão web, tablet ou mobile de um ecrã existente.
Trabalhar primeiro com código: leia qualquer ecrã como JSX com get-screen-jsx e escreva o seu próprio JSX com add-screen-jsx (novo ecrã) ou replace-screen-jsx (substituir um existente). Para usar as suas próprias imagens, carregue-as com upload-attachment e coloque o assetUrl devolvido no seu JSX. Estas ferramentas são gratuitas.
Manter o resultado alinhado com a marca: use update-design-guidelines para guardar as suas cores, tipografia e regras de componentes num ficheiro, como texto DESIGN.md. As gerações de IA feitas para esse ficheiro seguem-nas. Leia-as com get-design-guidelines ou limpe-as com delete-design-guidelines.
Importar do Figma: chame import-figma com a ligação de um frame do Figma e um fileId para trazer o frame para a tela como elementos editáveis. A organização do ficheiro tem de ter o Figma ligado primeiro.
Verificar a sua quota: chame get-plan-details para ver o seu plano, a utilização e as mensagens restantes antes de um lote de gerações.
Endpoint
2026-07-28, que anuncia em https://api.flowstep.ai/.well-known/mcp.json. Os clientes que usam o protocolo anterior 2025-11-25 ligam-se ao mesmo endpoint.
Próximos passos
Início rápido
Ligue um cliente e faça a sua primeira chamada de ferramenta.
Autenticação
Como funcionam o início de sessão OAuth 2.1 PKCE e a aprovação.
Ferramentas
Referência completa de entradas e saídas das 22 ferramentas.
Exemplos
Fluxos de trabalho completos para tarefas comuns.