Ir para o conteúdo
Arteon - logótipo da empresa
#MadeWithNext.js
Arteon logo

Ferramentas gratuitas para programadores web, designers e especialistas em marketing.

Ferramentas

  • Editor de imagens
  • Gerador de favicon
  • Verificador de meta título e descrição
  • Contador de palavras e caracteres
  • Gerador Lorem Ipsum
  • Gerador de assinatura de e-mail
  • Verificador de contraste de cores
  • Extrator de cores de imagem
  • Gerador de paletas de cores
  • Gerador de códigos QR gratuito

Ferramentas

  • pt para px
  • rem para px
  • em para px
  • cm para px
  • px para cm
  • mm para px
  • px para mm
  • polegadas para px
  • cm para polegadas
  • polegadas para cm

Ferramentas

  • mm para polegadas
  • polegadas para mm
  • kg para libras
  • libras para kg
  • HEX para RGB
  • RGB para CMYK
  • bytes para KB/MB/GB
  • Unix para data
  • DEC para BIN
  • DEC para HEX

Ferramentas

  • Mbps para MB/s
  • JPG para WebP
  • PNG para WebP
  • WebP para JPG
  • WebP para PNG
  • PNG para JPG
  • JPG para PNG
  • SVG para PNG
  • BMP para JPG
  • JPG para AVIF
© 2026 Arteon. Todos os direitos reservados.

Politica de Privacidade

Termos de Servico

Mapa do site

#MadeWithNext.js

Gere 17 paletas de cores a partir de uma cor base

Escolha uma cor de base e gere 17 paletas harmoniosas. Monocromática, complementar, triádica, pastel, escura e mais – todos os cálculos são executados localmente no seu navegador.

  1. /Ferramentas
  2. /Paletas de cores
Loading tool editor...
PUBLICIDADE
Gerador de paletas de cores – Arteon

Gerar paletas a partir de uma única cor

O gerador de paletas cria 17 paletas diferentes a partir de uma única cor de base, apoiando-se na teoria das cores. Cada paleta tem uma composição diferente – das variações monocromáticas às cores complementares contrastantes.

Todos os cálculos baseiam-se no espaço cromático HSL (Tonalidade, Saturação, Luminosidade). A tonalidade determina a cor de base, a saturação a intensidade e a luminosidade o caráter claro ou escuro. Este modelo corresponde à perceção humana das cores e presta-se perfeitamente à geração de paletas.

Como usar o gerador

A geração demora apenas alguns segundos:

  1. 1. Escolher a cor de base

    Introduza um código HEX ou utilize o seletor de cores.
  2. 2. Ver as paletas

    A ferramenta gera automaticamente 17 paletas com várias cores harmoniosas.
  3. 3. Copiar os códigos HEX

    Clique numa cor para copiar o seu código HEX. Utilize-o em CSS, Figma ou outras ferramentas.
PUBLICIDADE

17 tipos de paletas – qual combina com o seu projeto?

O gerador cria 17 esquemas cromáticos baseados na teoria das cores. Cada um segue uma lógica diferente:

  1. Paleta monocromática

    Vários níveis de luminosidade de uma única tonalidade. As cores transmitem coesão e serenidade. Adequada para relatórios corporativos, sites institucionais e projetos que pedem sobriedade visual.
  2. Paleta análoga

    Cores vizinhas no círculo cromático (cerca de 30° de distância). Transições suaves sem contraste brusco. Apreciada em ilustrações editoriais, blogs e materiais narrativos.
  3. Paleta complementar

    A cor base e a sua oposta no círculo (180°). Produz o maior contraste visual. Útil para botões de ação, banners promocionais e elementos que precisam de destaque imediato.
  4. Paleta triádica

    Três cores espaçadas de 120° formando um triângulo equilátero. Combinação vibrante e equilibrada. Funciona bem para identidade de marcas criativas e campanhas publicitárias.
  5. Paleta complementar dividida

    Em vez do complemento direto, usam-se os dois vizinhos deste. O contraste permanece evidente mas menos agressivo. Uma opção segura quando o esquema complementar parece intenso demais.
  6. Paleta pastel

    Saturação reduzida e luminosidade alta produzem tons suaves e delicados. Comum na cosmética, na moda infantil e na confeitaria artesanal.
  7. Paleta escura

    Saturação elevada e luminosidade baixa. Tons profundos e intensos para interfaces em modo escuro, marcas premium e produtos que visam exclusividade.
  8. Paleta tonal

    Uma escala de luminosidade da mesma tonalidade, do muito claro ao muito escuro. Corresponde aos níveis de cor dos design systems (ex.: 50 a 900). Indispensável para construir bibliotecas de componentes UI.
  9. Paleta minimalista

    Um acento cromático forte rodeado de neutros claros. Estilo típico de páginas de produto e landing pages contemporâneas com bastante espaço em branco.
  10. Paleta tetrádica (quadrada)

    Quatro tonalidades a 90° de distância no círculo cromático. Rica e equilibrada – especialmente indicada para dashboards, visualizações de dados e interfaces complexas que exigem muitas cores distintas.
  11. Paleta quente

    Tonalidades deslocadas para vermelhos, laranjas e amarelos. Transmite energia, calor e proximidade. Comum na restauração, na hotelaria e em campanhas de marketing dinâmicas.
  12. Paleta fria

    Tonalidades deslocadas para azuis, turquesas e violetas. Comunica calma, profissionalismo e confiança. Presente em fintech, saúde e branding corporativo.
  13. Paleta tons de terra

    Castanhos, olivas e ocres pouco saturados inspirados em paisagens naturais. Indicada para marcas biológicas, produtos artesanais e uma estética rústica e autêntica.
  14. Paleta néon

    Cores com saturação máxima e intensidade elétrica. Concebida para marketing arrojado, interfaces de jogos, marcas de vida noturna e designs que exigem atenção imediata.
  15. Paleta vintage

    Tons dessaturados e ligeiramente quentes que evocam impressões antigas e fotografia retrô. Ideal para marcas com história, produtos artesanais e uma estética nostálgica.
  16. Paleta alto contraste

    Amplitude de luminosidade extrema do quase preto ao quase branco com a tonalidade base. Excelente para designs acessíveis, hierarquia visual forte e interfaces em conformidade com as WCAG.
  17. Paleta pôr do sol

    Rotação fluida de tonalidades do quente para o frio, imitando um pôr do sol natural. Perfeita para secções hero, fundos com gradiente e projetos criativos.

Exemplo: HSL(210, 80%, 50%)

H = 210° (tonalidade azul)

S = 80% (intensa)

L = 50% (luminosidade média)

Mesma tonalidade, luminosidade diferente

L: 90% → 70% → 50% → 30% → 10%

Como funciona o espaço cromático HSL

Todas as paletas desta ferramenta baseiam-se no espaço cromático HSL (Tonalidade, Saturação, Luminosidade). Contrariamente ao HEX ou RGB, o HSL descreve as cores tal como as percecionamos:

  • Hue (H) – a tonalidade no círculo cromático (0°–360°). 0° = vermelho, 120° = verde, 240° = azul.
  • Saturation (S) – a intensidade. 0% = cinzento, 100% = cor plenamente saturada.
  • Lightness (L) – a luminosidade. 0% = preto, 50% = cor normal, 100% = branco.

Ao modificar seletivamente estes valores, obtêm-se paletas harmoniosas. As paletas monocromáticas variam apenas L, as análogas apenas H e as complementares invertem H em 180°.

PUBLICIDADE

A cor na arte e no design lusófono

O azulejo é a assinatura visual de Portugal. Desde o século XV, painéis de cerâmica azul e branca cobrem fachadas de igrejas, estações de comboio e palácios. O contraste entre o azul cobalto e o fundo branco cria um esquema cromático de alta legibilidade - o mesmo princípio que torna interfaces digitais claras e fáceis de navegar. A Estação de São Bento no Porto e o Mosteiro dos Jerónimos em Lisboa são exemplos icónicos desta paleta monocromática em azul.

O estilo Manuelino trouxe outra dimensão cromática à arquitetura portuguesa. Pedra calcária branca esculpida com motivos marítimos - cordas, algas, esferas armilares - ganha profundidade através de sombras naturais que criam gradientes de bege, creme e cinzento. Esta lição de cor através da textura aplica-se ao design digital: variações subtis de luminosidade numa só tonalidade produzem hierarquia visual sem necessidade de múltiplas cores.

No Brasil, o Modernismo de Tarsila do Amaral revolucionou o uso da cor. Obras como Abaporu (1928) utilizam verdes tropicais, amarelos intensos e azuis profundos que capturam a paisagem brasileira. Estes contrastes quentes e saturados inspiram paletas contemporâneas para marcas que procuram transmitir energia e autenticidade.

Simbolismo das cores na cultura portuguesa e brasileira

A bandeira portuguesa combina verde e vermelho com o amarelo da esfera armilar. O verde representa esperança e os oceanos que os navegadores cruzaram. O vermelho simboliza o sangue dos que lutaram pela nação. No branding para o mercado português, esta combinação evoca patriotismo, tradição e descoberta. Marcas de turismo, gastronomia e produtos regionais utilizam estes tons como ponto de partida.

No Brasil, o verde e amarelo da bandeira têm um significado diferente - riqueza natural e ouro. O azul do globo celeste e o branco das estrelas completam a paleta. O futebol brasileiro tornou o amarelo-canário num símbolo reconhecido mundialmente. Marcas brasileiras de desporto, lazer e entretenimento utilizam frequentemente este amarelo vibrante como cor principal.

As festas populares lusófonas têm paletas próprias. O Carnaval brasileiro explode com amarelo, verde, roxo, laranja e rosa - cores que transmitem alegria e celebração. As festas dos Santos Populares em Portugal decoram as ruas com manjerico verde, balões coloridos e sardinhas pintadas em todas as cores do arco-íris. O Natal lusófono mistura vermelho, dourado e verde escuro. Conhecer estes códigos culturais permite criar esquemas de cores que falam diretamente ao público-alvo.

PUBLICIDADE

Cor no branding e no mercado lusófono

O setor vinícola português é um exemplo de como a cor constrói identidade de marca. Os rótulos de Vinho do Porto usam bordô profundo, dourado e preto para comunicar tradição e prestígio. Os vinhos verdes do Minho preferem verdes claros, brancos e azuis suaves que evocam frescura e juventude. Uma paleta monocromática em tons de bordô ou uma paleta análoga em verdes e dourados funciona bem para este segmento.

O design digital lusófono está em crescimento acelerado. Startups em Lisboa, São Paulo e Luanda adotam paletas vibrantes - corais, turquesas, violetas e laranjas - para se destacarem em mercados competitivos. O contraste com o branding tradicional português, mais conservador, torna estas marcas jovens imediatamente reconhecíveis. O gerador de paletas oferece esquemas triádicos e complementares divididos que proporcionam este tipo de combinações arrojadas.

A indústria do turismo lusófono utiliza códigos cromáticos regionais. O Algarve inspira-se em tons de areia, azul oceano e branco calcário. A Amazónia brasileira traz verdes profundos, castanhos de terra e azuis de rio. Cabo Verde e Moçambique combinam turquesa tropical com laranjas e rosas quentes. Cada destino tem uma identidade cromática que as marcas locais aproveitam para criar ligação emocional com o público.

Onde utilizar as paletas geradas?

  1. Identidade visual de marca

    Selecione cores complementares para um logótipo existente ou construa uma paleta de branding do zero, para cartões de visita, papelaria e suportes de marketing.
  2. Sites

    Defina a cor principal, a cor de destaque e os tons de fundo. Os códigos HEX copiados colam-se diretamente nas folhas de estilo CSS ou na configuração de temas.
  3. Interfaces de aplicações

    A paleta tonal fornece variantes de luminosidade de uma cor: mais claras para os fundos, mais escuras para o texto, intermédias para bordas e estados interativos.
  4. Visuais para redes sociais

    Cores coerentes para publicações, stories e capas de perfil. As paletas análogas ou pastel funcionam bem para um estilo uniforme e reconhecível.
  5. Apresentações e documentos

    Conjuntos de cores harmoniosos para diapositivos, gráficos e infografias. As paletas monocromáticas ou minimalistas mantêm a ordem visual.
PUBLICIDADE

Resolução de problemas do gerador de paletas

  1. As paletas não mudam após introduzir uma cor

    Simplesmente digitar um código HEX não gera automaticamente as paletas: deve confirmar a alteração com o botão Atualizar cor. Só após a confirmação é que a ferramenta recalcula os 17 esquemas.
  2. Mensagem de formato inválido

    O gerador aceita apenas o formato HEX com # no início, por ex. #FF5500. Os formatos sem # (por ex. FF5500) ou em notação RGB (por ex. rgb(255,85,0)) não são suportados.
  3. Formato HEX curto e completo

    Ambos os formatos são suportados: completo #RRGGBB (por ex. #FF5500) e curto #RGB (por ex. #F50). O gerador reconhece automaticamente ambos e trata-os de forma idêntica.

Perguntas frequentes sobre o gerador de paletas

Quantas paletas a ferramenta gera?

A ferramenta gera 17 paletas diferentes a partir de uma única cor de base: monocromática, análoga, complementar, triádica, complementar dividida, tetrádica (quadrada), quente, fria, tons de terra, néon, vintage, alto contraste, pôr do sol, pastel, escura, tonal e minimalista.

O que é uma paleta monocromática?

Uma paleta monocromática é composta por variações de uma única tonalidade – todas as cores partilham a mesma tonalidade (H no modelo HSL) e variam apenas em luminosidade e saturação. Estas paletas são harmoniosas e particularmente adequadas para designs profissionais.

O que é uma paleta complementar?

Uma paleta complementar combina a cor de base com o seu complemento – a cor oposta no círculo cromático (desfasamento de 180°). Este contraste é um dos princípios fundamentais da teoria das cores e produz um efeito vivo e dinâmico.

Posso copiar as cores geradas?

Sim. Clique numa cor na paleta para copiar o seu código HEX para a área de transferência. Utilize-o diretamente em CSS, Figma, Adobe ou outras ferramentas de design.

O que é o espaço cromático HSL?

HSL significa Hue (tonalidade), Saturation (saturação) e Lightness (luminosidade). Contrariamente ao RGB, o HSL descreve as cores tal como as percecionamos: a tonalidade determina a cor de base, a saturação a intensidade e a luminosidade indica se a cor é clara ou escura. Todas as paletas desta ferramenta baseiam-se em cálculos HSL.

Qual a diferença entre triádica e complementar dividida?

Uma paleta triádica utiliza três cores equidistantes no círculo cromático (120° de intervalo). Uma paleta complementar dividida utiliza, em vez do complemento direto, os dois vizinhos do complemento – o que produz um contraste mais subtil.

Qual tipo de paleta é melhor para um site corporativo?

Paletas monocromáticas ou tonais funcionam bem para sites corporativos porque oferecem uma hierarquia visual unificada e serena. Use a paleta tonal para construir um sistema completo de fundos, textos, bordas e acentos a partir de uma única cor da marca.

Posso usar as paletas geradas em projetos comerciais?

Sim. Pode usar as paletas de cores geradas em qualquer projeto - comercial e não comercial, sem restrições de licença.

Ajude-nos a melhorar nossas ferramentas

Tem uma ideia para uma nova funcionalidade, encontrou um bug ou quer sugerir outra ferramenta que facilitaria seu trabalho? Escreva-nos – respondemos em 24 horas.

Gerador de paletas de cores – Arteon

Descubra outras ferramentas

Ver todas as ferramentas
JPG para WebP

JPG para WebP

Converta fotos JPG para WebP leve. Reduza o peso das imagens até 35%.

Abrir ferramenta
Editor de imagens

Editor de imagens

Redimensione, corte e converta a sua imagem. Formatos prontos para redes sociais, avatares circulares, exportação JPG/PNG/WebP.

Abrir ferramenta
Verificador de meta título e descrição

Verificador de meta título e descrição

Verifique o comprimento do título e da descrição em pixels. Pré-visualização Google em tempo real e dicas de otimização.

Abrir ferramenta
PNG para JPG

PNG para JPG

Converta ficheiros PNG para JPG no navegador. Sem limite de ficheiros, sem registo.

Abrir ferramenta
Gerador de favicon

Gerador de favicon

Crie um conjunto completo de favicon.ico para o seu site a partir de uma imagem. Todos os tamanhos necessários, sem registo.

Abrir ferramenta
Gerador de paletas de cores

Gerador de paletas de cores

Gere 9 paletas a partir de uma cor: monocromática, complementar, triádica e mais. Códigos HEX.

Abrir ferramenta
WebP para JPG

WebP para JPG

Converta ficheiros WebP para JPG compatível com tudo. Sem limites, sem registo.

Abrir ferramenta
Verificador de contraste de cores

Verificador de contraste de cores

Verifique o contraste de texto e fundo segundo WCAG 2.1 AA e AAA. Correção automática de cores.

Abrir ferramenta
Gerador de códigos QR gratuito

Gerador de códigos QR gratuito

Crie um código QR para site, cartão vCard ou impressão. Exporte PNG e SVG, sem registo.

Abrir ferramenta
Contador de palavras e caracteres

Contador de palavras e caracteres

Conte palavras, caracteres, frases e tempo de leitura. Verifique a legibilidade com a pontuação Flesch-Kincaid.

Abrir ferramenta

#4f6bf5

Todas as paletas abaixo baseiam-se nesta cor.

Paleta monocromática

Todas as cores partilham a mesma tonalidade (H) e variam principalmente em luminosidade (L) no espaço de cor HSL.

#0b28ba

hsl(230, 89%, 39%)

#153af2

hsl(230, 89%, 52%)

#4f6bf5

hsl(230, 89%, 64%)

#899cf8

hsl(230, 89%, 76%)

#c3ccfc

hsl(230, 89%, 88%)

Paleta triádica

Três tonalidades separadas por 120° no círculo cromático (vértices de um triângulo equilátero), uma geometria frequentemente utilizada em branding e designs inspirados na Bauhaus.

#4f6bf5

hsl(230, 89%, 64%)

#f43757

hsl(350, 89%, 59%)

#7ff667

hsl(110, 89%, 69%)

#f87f94

hsl(350, 89%, 74%)

#42f21f

hsl(110, 89%, 54%)

Paleta complementar dividida

Uma variante da paleta complementar: em vez de um complemento (180°), utilizam-se duas cores deslocadas de aproximadamente ±30° do complemento, reduzindo a tensão visual mas mantendo um forte contraste.

#4f6bf5

hsl(230, 89%, 64%)

#f5864f

hsl(20, 89%, 64%)

#bef54f

hsl(80, 89%, 64%)

#f7a176

hsl(20, 89%, 72%)

#b0f328

hsl(80, 89%, 56%)

Paleta pastel

A mesma tonalidade com saturação reduzida e luminosidade aumentada, um deslocamento para o centro e o topo do espaço HSL que produz cores suaves e "cremosas".

#e1e5f4

hsl(230, 45%, 92%)

#d3d7ee

hsl(230, 45%, 88%)

#c4cae9

hsl(230, 45%, 84%)

#b5bde3

hsl(230, 45%, 80%)

#a6b0dd

hsl(230, 45%, 76%)

Paleta escura

A mesma tonalidade com saturação elevada (S) e luminosidade reduzida (L) um deslocamento para baixo no eixo de luminosidade, produzindo cores profundas típicas do modo escuro e acentos intensos.

#3757f4

hsl(230, 89%, 59%)

#153af2

hsl(230, 89%, 52%)

#0c2dd2

hsl(230, 89%, 44%)

#0a25ab

hsl(230, 89%, 36%)

#081d85

hsl(230, 89%, 28%)

Paleta tonal (inspirada em Material Design)

Vários níveis de luminosidade de uma mesma tonalidade L variada e S moderada, semelhante às gamas tonais das diretrizes Material Design (ex.: 50-900).

#f2f3f8

hsl(230, 27%, 96%)

#dcdfef

hsl(230, 36%, 90%)

#b1bae7

hsl(230, 54%, 80%)

#7c8ee9

hsl(230, 71%, 70%)

#3e5df4

hsl(230, 89%, 60%)

Paleta minimalista (inspirada em Apple)

Um acento de cor vivo e vários neutros muito claros e suaves, uma composição típica de interfaces com muito espaço branco e sombras subtis.

#3e5df4

hsl(230, 89%, 60%)

#fafafa

hsl(230, 6%, 98%)

#efeff1

hsl(230, 6%, 94%)

#dfdfe2

hsl(230, 6%, 88%)

#484951

hsl(230, 6%, 30%)

Paleta análoga

Cores de tonalidades próximas, de aproximadamente -30° a +30° em torno da cor base no círculo cromático clássico (ex.: Itten).

#4fbef5

hsl(200, 89%, 64%)

#67a3f6

hsl(215, 89%, 69%)

#4f6bf5

hsl(230, 89%, 64%)

#4637f4

hsl(245, 89%, 59%)

#864ff5

hsl(260, 89%, 64%)

Paleta complementar

A cor base e o seu complemento deslocado 180° no círculo cromático, um dos contrastes fundamentais descritos por Johannes Itten.

#4f6bf5

hsl(230, 89%, 64%)

#1f42f2

hsl(230, 89%, 54%)

#f5d94f

hsl(50, 89%, 64%)

#f8e37f

hsl(50, 89%, 74%)

#f2cf1f

hsl(50, 89%, 54%)

Paleta tetrádica (quadrada)

Quatro tons espaçados 90 no círculo cromático (vértices de um quadrado) rica e equilibrada, ideal para temas UI complexos e visualização de dados.

#4f6bf5

hsl(230, 89%, 64%)

#f54fbe

hsl(320, 89%, 64%)

#f5d94f

hsl(50, 89%, 64%)

#4ff586

hsl(140, 89%, 64%)

#97a8f9

hsl(230, 89%, 79%)

Paleta de tons quentes

Cores deslocadas para a extremidade quente do espectro (vermelhos, laranjas, amarelos) evoca energia, calor e acessibilidade.

#f3d026

hsl(50, 89%, 55%)

#e7f548

hsl(65, 89%, 62%)

#c6f665

hsl(80, 89%, 68%)

#e8e00d

hsl(58, 89%, 48%)

#e5f886

hsl(70, 89%, 75%)

Paleta de tons frios

Cores deslocadas para a extremidade fria do espectro (azuis, turquesas, roxos) transmite calma, profissionalismo e confiança.

#0e34f1

hsl(230, 89%, 50%)

#4434f3

hsl(245, 89%, 58%)

#0c62d9

hsl(215, 89%, 45%)

#565cf5

hsl(238, 89%, 65%)

#0a3fb7

hsl(222, 89%, 38%)

Paleta de tons terrosos

Castanhos, olivas e ocres de baixa saturação inspirados em paisagens naturais perfeita para marcas ecológicas e estética rústica.

#9b9b4b

hsl(60, 35%, 45%)

#a3af6a

hsl(70, 30%, 55%)

#88813a

hsl(55, 40%, 38%)

#a6b686

hsl(80, 25%, 62%)

#a5ac53

hsl(65, 35%, 50%)

Paleta néon vibrante

Cores de saturação máxima com intensidade elétrica projetada para marketing ousado, interfaces de jogos e designs chamativos.

#1a40ff

hsl(230, 100%, 55%)

#330aff

hsl(250, 100%, 52%)

#2994ff

hsl(210, 100%, 58%)

#7f06f9

hsl(270, 95%, 50%)

#15d4f9

hsl(190, 95%, 53%)

Paleta vintage suave

Tons dessaturados e ligeiramente quentes que lembram impressões antigas e fotografia retro ideal para marcas com herança e estética nostálgica.

#7c87c1

hsl(230, 36%, 62%)

#9c8ac2

hsl(260, 31%, 65%)

#69a2bf

hsl(200, 40%, 58%)

#bc98c3

hsl(290, 27%, 68%)

#65b3a6

hsl(170, 34%, 55%)

Paleta de alto contraste

Faixa extrema de luminosidade do quase preto ao quase branco com o tom base excelente para designs acessíveis e forte hierarquia visual.

#030a30

hsl(230, 89%, 10%)

#081f91

hsl(230, 89%, 30%)

#0e34f1

hsl(230, 89%, 50%)

#869af8

hsl(230, 89%, 75%)

#f3f4f6

hsl(230, 15%, 96%)

Paleta gradiente pôr do sol

Uma rotação suave de tons quentes a frios, imitando um pôr do sol natural ótima para seções hero, fundos e projetos criativos.

#2648f3

hsl(230, 89%, 55%)

#6434f3

hsl(255, 89%, 58%)

#a917f2

hsl(280, 89%, 52%)

#e80dd6

hsl(305, 89%, 48%)

#d90c73

hsl(330, 89%, 45%)