Orbitautil
Design

Gerador de paleta de cores

Crie paletas de cores com combinações complementares, análogas, triádicas e monocromáticas. Copie HEX, RGB, HSL e variáveis CSS.

Processamento local no navegador

Como usar

  • Escolha uma cor base.
  • Selecione o tipo de harmonia.
  • Copie as cores ou variáveis CSS.

Cor base

Tipo de harmonia

Paleta gerada

Variáveis CSS

--primary: #0f766e;
--primary-light: #14b8a6;
--primary-dark: #115e59;
--secondary: #f59e0b;
--secondary-light: #fbbf24;
--secondary-dark: #d97706;

Preview em componentes

Título do card

Este é um exemplo de texto que aparece em um card com a cor primária selecionada.

Etiqueta
Ferramentas relacionadas

Ferramentas relacionadas

Continue com ferramentas e guias que ajudam a concluir a próxima etapa.

Ferramenta

QR Code colorido

Crie QR Code colorido com estilos de pontos, cantos, margem e fundo transparente. Baixe em PNG ou SVG.

Ferramenta

Gerador de Gradiente CSS Online

Crie gradientes CSS lineares e radiais, ajuste cores, posições e ângulo. Copie o código CSS pronto.

Ferramenta

Verificador de Contraste de Cores

Verifique o contraste entre texto e fundo seguindo as diretrizes WCAG. Veja se sua combinação atende aos níveis AA e AAA.

O que ela faz

Use para criar paletas para sites, marcas, posts, apresentações, QR Codes e interfaces.

Exemplo: cor base #0f766e gera paleta triádica com cores complementares harmônicas.

Como funciona

  • Converte cores entre espaços HSL e HEX.
  • Gera harmonias cromáticas automaticamente.
  • Calcula contraste WCAG para cada combinação.

Limitações

  • Paletas monocromáticas geram variações de luminosidade.
  • Contraste pode variar conforme a cor base.
  • Não substitui testes em contextos reais.

Quando usar

  • Design de interfaces.
  • Criação de marcas.
  • Paletas para QR Code.
  • Presets de tema.

Perguntas frequentes

O que é harmonia cromática?

É a relação entre cores no círculo cromático. Complementares são opostas, análogas são vizinhas, triádicas formam triângulo.

Posso usar no celular?

Sim. A ferramenta funciona em navegadores modernos em desktop e mobile.

As cores são exportadas?

Sim. Você pode copiar como HEX, CSS custom properties ou JSON.

Funciona offline?

Sim. Toda a lógica roda localmente no navegador.