Gerador de paletas de cores com IA: pedidos que dão paletas úteis

Qualquer assistente de chat capaz pode funcionar como gerador de paletas de cores com IA, e a diferença entre uma lista bonita e uma paleta útil está no pedido. Pede cinco a sete cores, cada uma com uma função (fundo, texto, destaque, superfície, contorno), um nome e um código hex, e descreve um lugar ou material reais em vez de um estilo. Depois verifica cada par que vai levar texto com um verificador de contraste, porque os assistentes indicam muitas vezes rácios que nunca calcularam. Os pedidos e as verificações abaixo levam cerca de dez minutos.

Porque é que pedidos de paleta genéricos dão paletas genéricas

"Dá-me uma paleta pastel moderna" pede ao modelo a resposta mais típica para um pedido muito comum. Recebes o mesmo verde-menta, rosa-pálido e lilás que todos os geradores gratuitos oferecem. Duas mudanças resolvem quase tudo: dá funções às cores e dá ao assistente algo específico para ter em mente.

Um pedido de paleta que podes copiar

Cria uma paleta de cores para [empresa, numa linha] destinada a [público].
Clima: [três palavras]. Inspiração: [um lugar, material ou momento real].
Evitar: [cores ou clichés que não queres].

Devolve 6 cores numa tabela: função, nome, hex.
Funções: fundo, texto escuro, texto claro, cor principal, destaque (uso moderado), superfície suave.
Depois diz quais pares foram pensados para receber texto.
Não indiques proporções de contraste; eu vou verificá-las.

A linha "inspirada em" faz o trabalho pesado. "Um porto às seis da manhã", "azulejos de barro depois da chuva" ou "o interior de um alfarrabista" dão ao modelo algo com relações de cor reais, e é por isso que ganham a rótulos de estilo. A paleta de cores a partir de uma imagem usa a mesma ideia com uma fotografia em vez de palavras.

Um exemplo prático

Aqui fica o tipo de resultado a esperar de um pedido para uma pequena florista, inspirado numa "estufa fria no início da primavera", com as palavras de ambiente calma, fresca e discretamente cara.

Transforma-a num fundo antes de a avaliares. Amostras em fila parecem sempre arrumadas; cores misturadas mostram se a família realmente combina ou fica enlameada onde se encontra.

Como verificar bem o contraste de uma paleta

Os modelos de linguagem preveem texto; não calculam. Um modelo pode dizer-te que um par passa quando não passa. Cola cada par de texto num verificador, como o verificador de contraste da WebAIM, e usa os limiares das WCAG.

Se um par falhar, faz ao assistente um pedido seguinte estreito: "Escurece a cor do texto escuro até atingir 4,5:1 sobre a superfície suave, mantendo o matiz." Depois volta a medir. O contraste de cor e acessibilidade explica os rácios, e o daltonismo no design trata de pares que passam o contraste mas continuam a confundir alguns leitores, como vermelho e verde com luminosidade parecida.

Pedidos seguintes que melhoram uma paleta

• "Dá-me uma versão clara desta paleta que mantenha o mesmo carácter, com as mesmas funções."
• "Qual destas cores é a mais próxima do que os meus concorrentes usam? Troca-a por algo que se distinga."
• "Escreve cada cor em oklch() além de hex e mantém os degraus de luminosidade uniformes entre os verdes."
• "Sugere uma divisão 60, 30, 10 para uma publicação social com esta paleta."
• "Escreve propriedades personalizadas de CSS para estas cores, nomeadas pela função e não pelo matiz."

O último é útil se construíres para a web: nomear pela função (--ground, --text-deep) permite trocar a paleta mais tarde sem mexer em cada regra. A regra 60 30 10 explica a divisão, e o OKLCH explicado mostra porque degraus uniformes de luminosidade tornam as misturas mais limpas.

:root {
  --ground: #0f1f1a;
  --text-deep: #1f3b32;
  --main: #4d7c66;
  --accent: #e8a0a8;
  --text-light: #eef2ec;
  --surface-soft: #c9d6cc;
}

Testa a paleta em designs reais

Uma paleta prova-se num feed carregado, não num chat. Faz três peças reais com ela: um anúncio, uma citação e uma publicação de saldos, nos tamanhos em que realmente publicas. Se o destaque começar a aparecer em todo o lado, já não é um destaque.

No Gradiently, as paletas vivem no kit de marca, e um Mark mantém as palavras legíveis por si: a sua zona mais calma move-se para trás do texto e a Tinta automática escolhe letra clara ou escura por linha a partir das cores do próprio Mark, por isso as palavras continuam legíveis em todos os tamanhos. O gerador de paletas de cores trata de caminhos sem IA para uma paleta, se preferires começar à mão.