The team behind OnlineTools4Free — building free, private browser tools.
Published Feb 4, 2026 · 6 min read · Reviewed by OnlineTools4Free
Teoria das Cores para Web Design: Guia Pratico
Fundamentos: Tom, Saturacao e Luminosidade
O modelo HSL e o mais intuitivo para cores no design digital:
- Tom (Hue): A cor em si. Medido em graus na roda cromatica (0-360).
- Saturacao: A intensidade. 100% e vivido, 0% e cinzento.
- Luminosidade: Controla o quao claro ou escuro e. 50% e o tom puro.
Esquemas de Cores Classicos
- Monocromatico: Um tom com variacoes de saturacao e luminosidade.
- Complementar: Duas cores opostas na roda cromatica.
- Analogo: Tres cores adjacentes na roda.
- Triadico: Tres cores equidistantes na roda.
O nosso seletor de cores ajuda a explorar estas harmonias.
Contraste e Acessibilidade
Diretrizes WCAG: ratio minimo 4.5:1 para texto padrao (AA), 3:1 para texto grande, 7:1 para AAA.
Psicologia das Cores
- Azul: Confianca, profissionalismo.
- Verde: Crescimento, natureza, sucesso.
- Vermelho: Urgencia, paixao.
Construir uma Paleta
Cor principal, cor secundaria, 5 tons de cinzento, cores funcionais. Use o nosso seletor de cores e o gerador de gradientes CSS.
Color Picker & Converter
Pick colors and convert between HEX, RGB, HSL, and CMYK formats.
OnlineTools4Free Team
The OnlineTools4Free Team
We are a small team of developers and designers building free, privacy-first browser tools. Every tool on this platform runs entirely in your browser — your files never leave your device.