Criação de sites e IA

Moodboard: o que é e como fazer um para sua marca ou site

O método neutro, no papel ou em qualquer app, com a parte que quase ninguém conta: como transformar o painel numa paleta que dá para ler na tela.

Equipe de redação da Notablia

14 min de leitura
Publicado em 27 de outubro de 2026

Moodboard é um painel com imagens, cores, fontes e texturas que define como sua marca ou seu site deve parecer e transmitir antes de você desenhar qualquer coisa. Dá para fazer numa tarde: você escolhe de 3 a 5 palavras da marca, junta referências, filtra até ficar com 8 a 15 peças e tira dali a paleta e a tipografia.

Quase tudo o que aparece no Google sobre isso vem do Canva, do Miro ou de lojas de MDF mostrando a própria ferramenta. Aqui está o método neutro e a parte que ninguém explica: como passar do painel para uma paleta que dá para ler na tela, com o caso real da marca Notablia. É o primeiro passo de qualquer projeto de criação de sites ou de marca.

Neste guia

O que é moodboard e para que serve

Moodboard serve para todo mundo imaginar a mesma coisa antes de desenhar: você, seu designer e seu cliente, com o mesmo painel na frente.

Moodboard é um painel visual que reúne imagens, cores, tipografias, texturas e palavras para definir o estilo de um projeto antes de desenhá-lo. Ele transforma adjetivos vagos como moderno ou acolhedor em referências concretas, para que a equipe e o cliente tomem as decisões de design com o mesmo critério.

O que ele não é: não é uma colagem decorativa, nem uma pasta do Pinterest com 300 pins sem filtro. Também não é o manual de marca. O moodboard vem antes e dá a direção; o manual vem depois e fixa as regras.

Quais são os tipos de moodboard?

Não existe uma lista oficial, mas eles se dividem por formato (físico ou digital) e por uso: marca, site, moodboard arquitetura e interiores, moda, foto ou vídeo e eventos, como um casamento. Muda o que pesa em cada um: na arquitetura mandam os materiais; num site, a tipografia e os botões.

Como fazer um moodboard passo a passo

Para fazer um moodboard, escreva as palavras da marca, junte referências sem julgar, fique com as melhores e tire delas as cores e as fontes.

Escreva o objetivo e de 3 a 5 palavras da marca

Para que é o painel (logo, site, loja ou fotos) e o que seu cliente deve sentir. «Acolhedora, artesanal, de bairro» filtra melhor que «bonita». A Nielsen Norman Group recomenda começar com 4 ou 5 palavras de clima.
Junte referências sem julgar

Ambientes, materiais, letras, embalagens, sites e cartazes. Saia do seu setor: uma padaria pode se inspirar num ateliê de cerâmica. Se alguma foto for parar no site, pegue de um banco de imagens grátis com licença clara, não do Google Imagens.
Filtre até ficar com 8 a 15 peças

Tire o que não combina com suas palavras ou contradiz o resto. Se estiver em dúvida entre duas direções, faça dois painéis: misturar as duas num só deixa tudo ilegível.
Organize o painel por hierarquia

Uma ou duas imagens grandes, o resto em volta e uma faixa com cores, fontes e palavras. Acrescente um cantinho de «isso não» com o que sua marca nunca deve parecer.
Tire a paleta e as fontes

Use o conta-gotas nas cores que se repetem, fique com 3 a 5 e dê uma função para cada uma. Escolha uma fonte para títulos e outra para texto.
Teste com alguém de fora

Mostre para alguém que não conhece o projeto e peça três adjetivos. Se baterem com suas palavras, o painel funciona.
Transforme o painel em decisões escritas

Anote os códigos HEX, as fontes, o estilo de foto e o que é proibido. Essa folha é a ponte entre o moodboard e o design final.

Quantas imagens colocar em um moodboard?

De 8 a 15 peças no total, contando cores e fontes, é o que melhor se entende numa olhada. Com menos de 6 não há direção; com mais de 20 vira pasta do Pinterest de novo. Cada IA deu um número diferente, e a gente testou.

Moodboard identidade visual: o que o da sua marca precisa ter

Um moodboard de identidade visual tem seis blocos: palavras da marca, imagens principais, estilo de foto, fontes, texturas e cores, mais o cantinho do «isso não».

Palavras da marca. De 3 a 5, escritas no próprio painel.
Uma ou duas imagens-âncora. As que você mostraria se só pudesse mostrar uma.
Estilo de foto. Luz, enquadramento, fundo e se aparecem pessoas.
Fontes. Com uma frase de exemplo, não só o nome.
Texturas. Papel kraft, linho ou metal dizem muito sobre o seu preço.
Cores. Amostras chapadas com o código.

Se o painel é para um logo, inclua referências dos tipos de logotipo para decidir antes que família você quer. E se você é designer, guarde cada moodboard aprovado: ele explica seu processo melhor que tudo quando você aprende como fazer um portfólio que conquista clientes.

Brandboard: o que é e qual a diferença para o moodboard

Um brandboard é uma lâmina única que resume a identidade de uma marca que você já escolheu: logo, paleta com códigos, fontes, tom de voz e alguns exemplos de aplicação. O moodboard procura o caminho; o brandboard mostra o caminho escolhido numa página só.

	Moodboard	Brandboard	Manual de marca
Quando se faz	No começo	Durante o design	No fim
Para que serve	Explorar direções	Validar a identidade com o cliente	Fixar as regras de uso
O que leva	Referências de outros e anotações	Logo, cores, fontes, tom e exemplos	Tudo isso e os usos errados
Tamanho	Um painel	Uma lâmina	Várias páginas

Para um negócio pequeno, a regra é simples. Se você só vai passar a marca para um desenvolvedor de sites, uma gráfica ou um letrista, um brandboard bem feito basta e poupa o manual longo. Se várias pessoas vão mexer na marca por anos, ou você quer franquear, faça o manual.

Para montar no Canva ou no Figma em meia hora, ponha no topo o logo sobre fundo claro e sobre fundo escuro. No meio, a paleta com o HEX e a função de cada cor. Embaixo, duas fontes com uma frase de exemplo e três frases que soem como a sua marca. Feche com um «sim» e um «não» de estilo de foto, tirados do seu moodboard.

Moodboard site: da paleta de cores às páginas

O moodboard do site vira decisões: de 3 a 5 cores com função, duas fontes, um estilo de foto e de botão, e contraste conferido.

O painel inspira; a paleta precisa funcionar. Por isso você não copia todas as cores do painel. Você distribui papéis: uma principal (logo, links, botões), uma ou duas secundárias, um destaque para o que você quer que seja clicado, um neutro claro de fundo e um escuro para o texto. Com o nosso gerador de paleta de cores você monta a harmonia e copia os códigos.

Depois vem o teste que quase todo mundo pula: o contraste. Pelas diretrizes WCAG 2.2 do W3C, texto normal precisa de contraste mínimo de 4,5:1 com o fundo, e texto grande (cerca de 24 px, ou 18,5 px em negrito), de 3:1.

Quais cores do moodboard podem ir no texto do site?

Só as que passam de 4,5:1 sobre o seu fundo. O caso da Notablia mostra bem. O guia de marca dela (2026) leva a ideia de «a bíblia do marketing com um marcador de página» para cinco cores com função. Este é o contraste de cada uma sobre o branco, calculado por nós com a fórmula da WCAG:

Cor	Código	Função	Contraste sobre branco	Texto normal (4,5:1)
Índigo	#3D3AE0	Principal e links	7,29:1	Sim
Violeta	#7C3AED	IA e detalhes	5,70:1	Sim
Coral	#FF5A36	Destaque	3,10:1	Não, só texto grande
Coral para texto	#D93A16	Destaque em texto pequeno	4,60:1	Sim
Tinta	#14161C	Texto e logo	18,08:1	Sim

O coral é a cor com mais personalidade e, ao mesmo tempo, a que não serve para um parágrafo. A solução não é tirar: é criar uma versão escura para o texto e deixar o coral vivo para botões grandes, ícones e detalhes. Faça o mesmo com o seu destaque.

Site para fazer moodboard grátis: Canva, Pinterest, Figma ou papel

Para um moodboard online grátis, basta o Pinterest para juntar e o Canva ou o Figma para montar; o papel ainda ganha em arquitetura e materiais.

Ferramenta	Melhor para	Plano grátis	Cuidado com
Pinterest	Juntar referências em pastas secretas	Sim	Não filtra por você
Canva	Montar o painel a partir de modelos de moodboard	Sim	Modelos muito vistos
Figma ou FigJam	Painéis de site e trabalho em equipe	Sim	Começo mais difícil
Milanote	Projetos criativos com notas e links	Sim, limitado	Feito para criativos
Miro	Oficinas ao vivo com o cliente	Sim, limitado	Enche de post-its
Papel-cartão e cortiça	Materiais reais, arquitetura e moda	Quase grátis	Não tem link para enviar

Um moodboard pinterest é ótimo para juntar, mas quase nunca é o painel final.

Qual é o melhor aplicativo para criar um moodboard?

O que você já domina. Para quem começa, o moodboard canva resolve em uma hora. Para moodboard design de site em equipe, o Figma. Para arquitetura, nada supera amostras reais. Trocar de app não resolve um painel sem filtro.

Prompts pra copiar e colar

Atue como diretor de arte. Meu negócio é [o que você vende], em [cidade], para [tipo de cliente], e quero que ele transmita [como deve parecer]. Me dê: 1) cinco palavras da marca, 2) doze buscas específicas para o Pinterest que combinem com essas palavras, 3) três coisas que minha marca nunca deve parecer e 4) uma paleta de 5 cores com a função e o código HEX de cada uma. Não invente dados do meu negócio: se faltar algo, me pergunte.

Moodboard de casamento: como fazer um e usar para fechar vendas

Um moodboard de casamento é o painel que fixa o clima da festa antes de contratar qualquer coisa: paleta, flores, mesa, iluminação, trajes, papelaria e o tom do dia. Para quem vende para casais (cerimonialista, decorador, fotógrafo ou buffet), ele também é uma ferramenta de venda.

O casal monta assim:

Três ou quatro palavras para o dia, como «rústico, litorâneo, à luz de velas».
De 10 a 15 referências: local, flores, mesa posta, vestido e traje, convite e iluminação.
A paleta em quadrados chapados, com 3 a 5 cores.
Uma versão datada. Se mudarem de ideia, façam outro painel em vez de apagar o anterior.

E o fornecedor usa para vender assim:

Mande o modelo antes do orçamento. O casal preenche e você orça em cima do que ele escolheu, não do que você imagina.
Tenha um painel por estilo. Um rústico, um clássico e um minimalista, por exemplo. Mostrar o clima ajuda o casal a decidir sem ter de imaginar a partir de uma lista de itens.
Use o painel aprovado como contrato visual. Cada item do orçamento aponta para uma peça do painel, e as discussões de «não era isso que eu imaginava» diminuem.
Compartilhe o mesmo painel com todos. Floricultura, fotógrafo e iluminação trabalham com a mesma imagem na cabeça.

Peça também ao casal três coisas que eles não querem ver na festa. Esse cantinho do «isso não» poupa muito retrabalho.

Exemplos de moodboard: marca, site, arquitetura e moda

Cada tipo de moodboard olha para uma coisa: a marca para as sensações, o site para a interface, a arquitetura para os materiais e a moda para a estação.

Tipo	O que leva	Exemplo ilustrativo
Marca	Palavras, fotos de clima, letras e cores	Padaria em Curitiba: «acolhedora, artesanal»; madeira, kraft, creme e verde-oliva
Site	Fontes, botões, fotos e ícones	Clínica de fisioterapia: «calma, confiança»; luz natural, botões arredondados
Arquitetura	Materiais, mobiliário e luz	Cafeteria: carvalho, azulejo verde e latão
Moodboard moda	Tecidos, cores da estação e poses	Coleção de tricô: lã crua e tons terrosos

São exemplos de moodboard ilustrativos, não casos de clientes. Para ver exemplos reais, o Behance tem milhares: repare em como os mais claros usam poucas peças.

Perguntas frequentes sobre o moodboard

O que é um moodboard de moda?

Um moodboard de moda é o painel que define a inspiração de uma coleção ou de um ensaio de fotos: silhuetas, tecidos, cores da estação, styling, poses e locações. Diferente do moodboard de marca, ele muda a cada coleção ou campanha. Se você vende roupa online, ele serve para dirigir as fotos de produto: o fotógrafo sabe que luz, fundo e atitude você quer sem precisar adivinhar. Um bom painel de moda cabe numa tela e se entende em segundos.

Como fazer um moodboard de arquitetura?

Para fazer um moodboard de arquitetura, comece pelo conceito do projeto em três ou quatro palavras e junte referências de materiais, revestimentos, marcenaria, iluminação e mobiliário. Aqui o físico pesa mais: amostras reais de MDF, piso, tecido e tinta mostram textura e cor de verdade. Monte uma prancha por ambiente, com as imagens principais maiores, e valide com o cliente antes de detalhar o projeto. No digital, Canva, Figma e Miro resolvem bem.

Moodboard ou mood board: qual é o certo?

As duas formas existem: em inglês o termo nasceu separado, mood board, e no Brasil se escreve muito mais junto, moodboard, que é como a maioria pesquisa no Google. Em português também se usa painel semântico ou painel de inspiração. Escolha uma forma e use sempre a mesma no seu site e nas propostas para clientes. Se o cliente não é da área, explique o termo na primeira vez que aparecer.

O que é painel semântico?

Painel semântico é o nome em português do moodboard: um painel com imagens, cores, texturas, tipografias e palavras que traduz o conceito de um projeto antes de desenhá-lo. O termo é muito usado em cursos de design, moda e arquitetura no Brasil. Semântico porque cada elemento carrega um significado: a madeira sugere acolhimento, o metal escovado sugere tecnologia. Na prática, painel semântico e moodboard são a mesma ferramenta com nomes diferentes.

Como se pronuncia moodboard?

Em inglês, moodboard se pronuncia mais ou menos «mudbórd»: o «u» de «mood» é longo, como em «mudo» dito com calma, e «board» termina em «órd», sem vogal no final. No Brasil quase todo mundo adapta o som e ninguém deixa de ser entendido. Se você prefere evitar o estrangeirismo numa reunião com cliente, diga painel semântico ou painel de inspiração, que significam o mesmo.

Qual IA pode criar moodboards?

Várias IAs ajudam a criar moodboards: Adobe Firefly e Canva já têm funções de moodboard com inteligência artificial, e geradores de imagem como Midjourney criam texturas e ambientes que você não encontra em bancos de fotos. Chats como ChatGPT ou Gemini servem para definir as palavras da marca e listar buscas para o Pinterest. Use a IA para inspirar, não para as imagens finais do site: cada ferramenta tem seus termos de uso.

Como fazer um moodboard no Canva?

Para fazer um moodboard no Canva, busque moodboard nos modelos, escolha um com espaços para imagens e apague o que sobrar. Suba suas referências, arraste para os espaços e deixe uma ou duas maiores como imagens principais. Acrescente quadrados de cor com o código HEX de cada tom e escreva as palavras da marca com as fontes candidatas. No fim, baixe em PDF ou compartilhe um link só de visualização com o cliente.