Amarelo - Significado, Paletas, Cores Complementares e Harmonias
Um guia prático para a cor amarelo: simbolismo e psicologia, o roda de cores relacionamentos (complementares, análogos, triádicos), acessível combinações de corese paletas para download. Converter entre HEX, RGB, e HSL, copie variáveis CSS e visualize cores correspondentes que combinem.
Dica: pressione Digitar dentro de qualquer campo para atualizar todos os valores.
Amarelo de relance
Amarelo sinaliza luz solar, calor, curiosidade e otimismo. É excelente como cor de destaque para destacar frases de chamariz, etiquetas de preços e alertas. Para leitura longa, prefira tons mais suaves para maior conforto.
O amarelo puro tem baixo contraste no branco. Para uma IU acessível, coloque amarelo em azul marinho, carvão ou violeta profundo. Use texto preto ou cinza muito escuro em fundos amarelos claros.
Paletas Amarelas
Gerado automaticamente matizes (mais branco), tons (mais preto) e tons (mais cinza) do amarelo atual. Clique em qualquer amostra para copiar HEX. Você também pode baixar uma paleta PNG.
Matizes
Tons
Tons
Harmonias da roda de cores
Explorar complementar pares de cores, análogo vizinhos, e triádico conjuntos deste amarelo. Essas combinações prontas ajudam você a encontrar cores que combinam bem.
Cores opostas na roda de cores criam alto contraste para CTAs e emblemas.
Os vizinhos ao volante parecem harmoniosos – ótimos para fundos e gradientes.
Três tons uniformemente espaçados oferecem contraste equilibrado para painéis e gráficos.
Aplicativos e práticas recomendadas
Marca
O amarelo acrescenta simpatia e energia às marcas de varejo, alimentos, produtos infantis e viagens. Combine com carvão ou azul marinho profundo para equilíbrio profissional e tipografia legível.
IU e acessibilidade
Use o amarelo como destaque para botões e destaques. Para conteúdo longo, escolha tons claros como plano de fundo com texto escuro para atender ao contraste das WCAG.
Marketing e Embalagem
Amarelo chama a atenção nas prateleiras e nos feeds sociais. Azuis ou roxos complementares criam seções de heróis e cartões de produtos impressionantes.
Características
- Instantâneo HEX ↔ RGB ↔ HSL conversão e sincronização.
- Paletas automáticas: matizes, sombras, tons, além de paleta PNG para download.
- Harmonias da roda de cores: sugestões complementares, análogas e triádicas.
- Rápido Variáveis CSS exportar para sistemas de design.
Como usar
- Insira um HEX (por exemplo
#FFD600) ou valores RGB/HSL e pressione Digitar. - Clique em qualquer amostra para copiar seu HEX. Use conjuntos complementares ou triádicos para obter contraste forte.
- Baixe o PNG da paleta ou copie as variáveis CSS e cole em seu projeto.
- Verifique dicas de contraste para manter o texto legível em UIs amarelo claro.
Perguntas frequentes
Quais são as cores que combinam bem com o amarelo?
Marinho, carvão, violeta profundo e verde floresta rico combinam perfeitamente. Para detalhes brilhantes, use azul ciano ou roxo complementar.
Qual é a cor oposta do amarelo?
Em uma roda RGB/HSL, o matiz oposto está próximo azul-ciano (cerca de 180° da tonalidade amarela).
Posso usar amarelo no corpo do texto?
Geralmente não em fundos claros. Mantenha amarelo para destaques ou ícones; use texto escuro em um cartão amarelo claro.