Paleta de cores

Conjunto definido de cores com função clara, usado de forma consistente em todo o produto.

Hard

O que é

Paleta de cores não é só uma coleção de cores que alguém achou bonitas. Ela é um sistema em que cada cor tem um papel: a primária ancora a marca e puxa pra ação, as secundárias dão flexibilidade, as neutras carregam fundo e texto, e as semânticas sinalizam estado, como sucesso, erro ou alerta. Pensar nesses papéis é o que separa uma paleta de uma simples seleção de tons.

O valor real da paleta aparece quando ela vive dentro de um design system, com regra clara de onde e quando cada cor entra. Times maduros guardam isso em tokens, ou seja, uma variável como cor-interativa-primaria carrega o valor por todos os componentes. A vantagem é direta: muda o token, muda o produto inteiro de uma vez.

O token também é o que resolve o dark mode com elegância. A mesma cor de superfície vira branco quente no modo claro e cinza profundo no escuro, sem ninguém precisar refazer a paleta do zero.

Em uma frase

Se a paleta estiver toda em token, a gente troca o azul da marca num lugar só.

A pergunta que ele responde

Como organizo as cores do produto pra manter tudo consistente quando algo muda?

Quando usar

Use ao montar ou revisar a base visual de um produto, principalmente quando ele roda em web, iOS e Android ao mesmo tempo e precisa manter coerência entre as plataformas.

Como não usar

O cuidado é não espalhar hex solto pelo código. Sem token por trás, manter o modo claro e o escuro em sintonia vira retrabalho constante a cada ajuste.

Na prática

Imagine que o time decide trocar o azul da marca. Como tudo aponta pro token, a cor muda em todos os botões e links de uma vez, sem ninguém precisar caçar hex na mão pelo código.

Não confunda com

Vale separar paleta de teoria das cores. A teoria explica como as cores se relacionam entre si, enquanto a paleta é a decisão concreta de quais cores este produto vai usar e pra quê. Ou seja, uma é o conhecimento de fundo e a outra é a aplicação no caso real.

D

Em inglês

Color palette

Pronúncia

n/a

Também chamado de

paleta, palette

Origem

n/a

Fonte

Saiba mais

Material Design, documentação sobre sistema de cor e tokens.