Color Picker e Gerador de Paleta

Seletor de cores avançado com gerador de paletas harmoniosas. Escolha cores manualmente, gere paletas automaticamente e obtenha códigos em HEX, RGB, HSL.

Seletor de Cores
Matiz (Hue) 0°
Saturação (Saturation) 100%
Luminosidade (Lightness) 50%
Opacidade (Alpha) 100%
Informações da Cor
HEX: #FF0000
RGB: rgb(255, 0, 0)
RGBA: rgba(255, 0, 0, 1)
HSL: hsl(0, 100%, 50%)
HSLA: hsla(0, 100%, 50%, 1)
Gerador de Paletas
Tamanho:
Histórico de Cores
Teoria das Cores e Tipos de Paletas
🎨
Monocromática
Cores derivadas de um único matiz, variando em saturação e luminosidade. Cria designs harmoniosos e elegantes.
🌈
Análoga
Cores adjacentes no círculo cromático. Cria combinações ricas e agradáveis, ideais para designs naturais.
⚡
Complementar
Cores opostas no círculo cromático. Oferece alto contraste e impacto visual, ideal para chamar atenção.
🔶
Triádica
Três cores equidistantes no círculo cromático. Oferece contraste vibrante mantendo harmonia.
Como Usar o Color Picker
Passo a passo para criar paletas perfeitas:
  • 1. Selecione uma cor: Clique na área do color picker ou use os sliders para ajustar manualmente
  • 2. Obtenha os códigos: Copie os valores HEX, RGB, HSL ou HSLA para usar em seus projetos
  • 3. Gere uma paleta: Escolha um tipo de harmonia e clique em "Gerar Paleta"
  • 4. Exporte: Baixe sua paleta como imagem ou copie os códigos de todas as cores
  • 5. Experimente: Use cores aleatórias ou carregue exemplos práticos para inspiração
Dicas para Designers:
  • Use cores complementares para botões de ação (CTAs)
  • Paletas monocromáticas são seguras para interfaces corporativas
  • Cores análogas criam atmosferas calmas e naturais
  • Adicione uma cor de destaque (accent color) para guiar a atenção do usuário
  • Teste o contraste de suas cores para acessibilidade (WCAG AA/AAA)
  • Considere a psicologia das cores para diferentes públicos-alvo
Exemplos Práticos de Uso
Para diferentes tipos de projetos:
🖥️
Landing Page
Paleta azul com cor de destaque laranja. Ideal para tecnologia e startups.
🛒
E-commerce
Paleta quente com vermelho para CTAs. Aumenta conversões e engajamento.
📝
Blog Educacional
Paleta verde com tons terrosos. Transmite confiança e conhecimento.
🎨
Portfólio Criativo
Paleta vibrante e contrastante. Mostra originalidade e criatividade.