Resumindo
- O Gradiently mantém um servidor MCP hospedado para o Claude em https://gradiently.design/api/mcp.
- No app do Claude, o Gradiently é adicionado como conector personalizado com login por OAuth; no Claude Code, ele é adicionado com uma chave de API com escopo em Configurações › API e agentes.
- Uma chave de API nova já nasce com as permissões de que toda ferramenta de design precisa, e Reservar Marks fica desativado, a menos que você ative.
- Quando o Claude compõe um design com as ferramentas do Gradiently, não gasta nenhum crédito de IA do Gradiently, e todo design salvo abre no Studio.
- Uma chave só funciona no espaço de trabalho que a emitiu, age como o dono ou administrador que a criou e pode ser revogada na hora.
Nesta página
Para configurar o conector Gradiently para Claude, aponte o Claude para o servidor MCP hospedado do Gradiently em https://gradiently.design/api/mcp. No app do Claude, adicione-o como conector personalizado e entre no Gradiently. No Claude Code, adicione-o pelo terminal com uma chave de API com escopo. Nos dois casos, o Claude passa a buscar Marks, ler seu kit de marca e criar designs que ficam salvos no seu espaço de trabalho e abrem no Studio, com cada palavra ainda editável.
O MCP, o Model Context Protocol, é o padrão aberto que permite ao Claude usar ferramentas de verdade. O que é MCP explica de forma simples, e o protocolo em si está documentado em modelcontextprotocol.io.
Qual caminho usar para conectar o Claude
Como ele se conecta
Login
Como ele se conecta
Login
Como ele se conecta
Login
Qualquer que seja o caminho, você precisa ser dono ou administrador do espaço de trabalho no Gradiently. Editores e leitores não podem conectar assistentes nem criar chaves.
Conecte o app do Claude com um conector personalizado
- 1
Abra as configurações de conectores do Claude
Adicione um conector personalizado. Quais planos do Claude permitem conectores personalizados é decisão da Anthropic, então consulte a ajuda do Claude se não encontrar a opção. Conectores do Claude explica o recurso.
- 2
Cole o endereço do servidor
Chame de Gradiently e use
https://gradiently.design/api/mcp. Escolha o login por OAuth. - 3
Entre e escolha um espaço de trabalho
Na janela do Gradiently, escolha o espaço de trabalho em que o Claude deve atuar e leia as permissões em Permitir que este assistente possa.
- 4
Permita e confira
Escolha Permitir conexão. De volta ao Claude, peça que ele liste as ferramentas do Gradiently para confirmar.
O acesso se renova automaticamente por até 30 dias, depois dos quais você reconecta. Um conector personalizado já é seu para usar de imediato; uma vaga no diretório público do Claude é outra coisa e precisa da revisão da Anthropic.
Conecte o Claude Code com uma chave de API com escopo
O Claude Code usa uma chave em vez de login. Crie uma no Gradiently em Configurações › API e agentes: escolha o espaço de trabalho, dê um nome que diga onde ela vai ficar (Claude Code, notebook), marque o que ela pode fazer e selecione Criar chave. A chave aparece uma única vez, então copie para o seu gerenciador de senhas na hora.
export GRADIENTLY_API_KEY="gr_live_…"
claude mcp add --transport http gradiently https://gradiently.design/api/mcp \
--header "Authorization: Bearer $GRADIENTLY_API_KEY"Outros clientes que leem um arquivo JSON costumam aceitar o mesmo servidor e o mesmo cabeçalho. As Configurações mostram um trecho pronto em Conectar um cliente MCP.
{
"mcpServers": {
"gradiently": {
"url": "https://gradiently.design/api/mcp",
"headers": { "Authorization": "Bearer gr_live_…" }
}
}
}Como escolher as permissões da chave
Cada permissão é um escopo. Uma chave nova já vem com cinco que cobrem todas as ferramentas de design, então a maioria das pessoas não muda nada. Acrescente as outras só quando o Claude realmente precisar.
Ativada por padrão
O que permite
Ativada por padrão
O que permite
Ativada por padrão
O que permite
Ativada por padrão
O que permite
Ativada por padrão
O que permite
Ativada por padrão
O que permite
Ativada por padrão
O que permite
Ativada por padrão
O que permite
O que o Claude pode fazer depois de conectado
O Claude trabalha pelas mesmas ações que você tem no produto. Ele pode buscar no Mercado por nome, palavras de cor ou código; ler o perfil, a voz e as fontes da sua marca; desenhar um design original, olhar a imagem renderizada e refinar; preencher um dos templates do Gradiently; mudar as palavras de um design salvo; fazer cópias redimensionadas; e renderizar um design em PNG ou PDF. Quando o Claude compõe o design sozinho, o Gradiently não cobra créditos de IA. Se você pedir que ele passe o trabalho ao Designer do Gradiently, isso usa créditos como no Studio.
O Claude Code facilita um tipo específico de tarefa. Digamos que você mantém um blog e quer uma imagem de link para cada post. Peça: “Para cada post em /content, faça uma prévia de link de 1200×630 na nossa marca com o título do post e depois renderize cada uma como PNG em /public/og.” O Claude desenha cada imagem no Gradiently, confere e grava os arquivos onde o seu site espera. Tamanho da imagem Open Graph explica por que 1200×630.
Uma prévia de link de 1200×630 desenhada pelo servidor MCP do Gradiently e renderizada direto na pasta de um site.
Prompts que funcionam bem com o Claude
- “Leia o perfil da nossa marca e depois faça um post de LinkedIn e um post no X anunciando nosso novo escritório em Bristol.”
- “Encontre três Marks escuros com material acetinado, próximos de um verde-azulado profundo, e me dê os códigos.”
- “Pegue o anúncio de ontem e faça a partir dele um story e uma miniatura do YouTube.”
- “Mude a data do pôster do evento para 14 de novembro e renderize em PDF.”
Quanto melhor o seu kit de marca, menos você precisa dizer em cada pedido; voz da marca para IA mostra o que preencher. Para mais ideias voltadas a posts de redes sociais, veja Claude para redes sociais e, para um panorama maior, design com o Claude.
Como manter a conexão segura
Uma chave pode
- Atuar no único espaço de trabalho que a emitiu
- Fazer o que o papel de quem a criou e seus escopos permitem
- Criar designs que pertencem ao espaço de trabalho
- Mostrar nas Configurações quando foi usada pela última vez
Uma chave nunca pode
- Acessar outro espaço de trabalho, mesmo um do qual você faça parte
- Pagar nada nem acessar a cobrança
- Transferir, listar ou liberar um Mark
- Criar ou gerenciar outras chaves
Se uma chave vazar ou você deixar de usá-la, selecione Revogar ao lado dela em Configurações › API e agentes e ela para de funcionar na hora. As chaves também deixam de funcionar quando quem as criou sai do espaço de trabalho ou perde o papel de administrador. Usa o ChatGPT também? Gradiently no ChatGPT tem a própria configuração, e a referência completa das ferramentas está na documentação para desenvolvedores.
Perguntas frequentes
Qual é o endereço do servidor MCP do Gradiently para o Claude?
https://gradiently.design/api/mcp. No app do Claude, use como conector personalizado com OAuth; no Claude Code, adicione com a sua chave de API no cabeçalho Authorization.
Preciso de uma chave de API para usar o Gradiently no Claude?
No app do Claude não, que entra com OAuth. O Claude Code e a maioria dos outros clientes MCP precisam de uma chave com escopo em Configurações › API e agentes.
O Claude gasta meus créditos de IA do Gradiently?
Não quando ele compõe os designs sozinho com as ferramentas do Gradiently. Passar um trabalho ao Designer do Gradiently usa créditos.
O Claude pode reservar um Mark para mim?
Só com uma chave que tenha a permissão Reservar Marks, que vem desativada por padrão. Qualquer reserva que exija pagamento ainda precisa ser concluída no Gradiently.
Por que o Claude diz que não consegue autenticar?
A chave foi digitada errada ou revogada, ou quem a criou deixou de ser dono ou administrador do espaço de trabalho. Crie uma chave nova e atualize o seu cliente.
Escrito pelo Gradiently
A equipe por trás do Gradiently, uma ferramenta de design criada em torno dos Marks: gradientes vivos que fazem tudo o que você cria ter a sua cara.
Ver nosso perfil