Ferramentas de Cor e Tipografia Online

Escolher cores e tipografia é uma das partes mais importantes do trabalho visual, e também uma das mais fáceis de errar. Essas ferramentas ajudam a fazer escolhas informadas.

Paletas de cor

Coolors

coolors.co: gerador de paletas de cor. Aperte espaço para gerar paletas aleatórias. Trave as cores que gosta e continue gerando até ter a paleta ideal. Exporta em todos os formatos.

Adobe Color

color.adobe.com: ferramenta da Adobe com regras de harmonia de cor (complementar, análogo, triádico…). Integra com o Creative Cloud.

Paletton

paletton.com: visualização de harmonias de cor com roda cromática. Útil para entender por que uma paleta funciona.

Huemint

huemint.com: IA que gera paletas de marca baseadas em contexto. Bom ponto de partida para identidades visuais.

Colorhunt

colorhunt.co: coleção curada de paletas feitas por designers. Organizado por tema e popularidade.

Ferramentas específicas de cor

CSS Gradient

cssgradient.io: editor de gradiente com preview em tempo real. Útil para recriar gradientes que você vê em referências.

Contrast Checker

webaim.org/resources/contrastchecker: verifica ratio de contraste para acessibilidade. Útil quando o texto precisa ser legível sobre cores.

Tipografia

Google Fonts

fonts.google.com: o maior repositório de fontes gratuitas para uso comercial. Qualidade inconsistente mas tem gems. Filtre por categoria (serif, sans-serif, display, monospace).

Adobe Fonts (CC)

fonts.adobe.com: incluso no Creative Cloud. Qualidade geral muito superior ao Google Fonts. Ative diretamente no after/Premiere.

Fontshare

fontshare.com: fontes grátis de alta qualidade. Coleção menor que Google Fonts mas curadoria muito melhor.

Dafont

dafont.com: display fonts e fontes decorativas. Verifique a licença de cada fonte, nem todas são para uso comercial.

Pares tipográficos

Fontjoy

fontjoy.com: sugere pares de fontes que funcionam bem juntas. Útil quando você escolheu uma fonte principal e precisa de um complemento.

Inspeção de fonte

WhatFont (extensão do Chrome)

Identifica qualquer fonte em qualquer site: passe o mouse sobre o texto e vê a fonte, tamanho, peso, spacing.

Fontanello (extensão)

Similar ao WhatFont mas com mais detalhes técnicos (line-height, letter-spacing).