A ferramenta interativa de circulo cromatico e círculo cromático completo para criar paleta de cores que combinam perfeitamente.
Regra de Harmonia Cromática
Arraste o ponto principal para girar a harmonia
50%
Escuro (10%)Vibrante (50%)Claro (90%)
Cor Selecionada (Base)Harmonia: Complementar
#
RGB105, 62, 254
HSL253°, 99%, 62%
HSB / HSV253°, 76%, 100%
CMYK59, 76, 0, 0
Paleta Gerada
Visualização Real em Interface (UI Preview)Veja como sua paleta harmoniza em componentes reais
Novo LançamentoDesign System v1.0
Harmonia Cromática para Interfaces Modernas
A combinação perfeita entre contraste, acessibilidade e elegância visual para seu próximo projeto.
Verificador de Acessibilidade & Contraste (WCAG 2.1)Ratio Mínimo: 4.5:1 (AA)
Exportar Paleta de Cores
Pronta para Código & Design
URL compartilhável gerada automaticamente
Inspirações Rápidas • Paletas de Cores Populares
Paleta de Cores que Combinam: Clique para Carregar no Círculo
15 Paletas Prontas
Copiado para a área de transferência!
01 • TEORIA DAS CORES & HISTÓRIA
O que é o Círculo Cromático e Como Funciona a Roda de Cores?
O círculo cromático (também comumente grafado como circulo cromatico ou simplesmente roda de cores) é o instrumento geométrico fundamental desenvolvido para organizar e relacionar todas as tonalidades visíveis pelo olho humano. No portal circulocromaticocores.com, o circulo cromatico online permite gerar harmonias automáticas, calcular códigos hexadecimais e validar contraste WCAG em tempo real.
Criado em 1666 por Isaac Newton com um prisma de luz, o círculo cromático das cores evoluiu com Goethe e Johannes Itten na Bauhaus até o círculo cromático completo de 12 tonalidades.
Cores Primárias
Matizes puros e elementares que não resultam da mistura de outros tons. No modelo artístico tradicional (RYB), são Vermelho, Azul e Amarelo; em telas digitais (RGB), Vermelho, Verde e Azul; e na indústria gráfica (CMYK), Ciano, Magenta e Amarelo.
Cores Secundárias
Nascem da união equilibrada de duas cores primárias adjacentes. No círculo cromático tradicional, Vermelho e Amarelo geram Laranja; Azul e Amarelo criam Verde; e Vermelho com Azul produz Roxo/Violeta.
Cores Terciárias
Resultam da mescla de uma cor primária com sua secundária vizinha, originando seis nuances intermediárias: vermelho-alaranjado, amarelo-alaranjado, amarelo-esverdeado, azul-esverdeado (turquesa), azul-arroxeado e vermelho-arroxeado.
Seja pesquisando por circulo cromático ou círculo cromatico, dominar as circulo cromatico cores facilita compor projetos gráficos marcantes, identidades sólidas e ambientes acolhedores.
02 • HARMONIAS CROMÁTICAS
Círculo Cromático Combinação de Cores e Harmonias
Ao dominar o circulo cromatico combinação de cores, você equilibra temperaturas e contrastes visuais:
180° de Oposição
Cores Complementares
No circulo cromatico cores complementares ficam em lados opostos (180°). Pares clássicos de cores complementares como Azul e Laranja geram contraste simultâneo máximo, ideal para botões de conversão e elementos de destaque.
30° a 60° Vizinhas
Cores Análogas
Cores vizinhas no disco (30° a 60°), como verde e azul. Transmitem calma e unidade orgânica, ideais para spas, leitura e marcas ecológicas.
Triângulo Equilátero 120°
Tríade Cromática
Três cores a 120° formando um triângulo equilátero. Entrega vivacidade e dinamismo com estabilidade, perfeita para marcas jovens e ilustrações.
Split-Complementary
Meio-Complementar
Une a cor base às duas adjacentes de sua complementar. Mantém alto dinamismo com menor tensão óptica, ideal para sites e design editorial.
Dois Pares Cruzados
Tétrade / Retângulo
União geométrica de dois pares de cores complementares em retângulo. Esquema rico em opções visuais. Recomenda-se eleger uma cor dominante e aplicar as outras três em detalhes, ícones e acentos.
Mesmo Matiz (HSL)
Monocromático
Baseia-se em um único matiz cromático, variando exclusivamente sua saturação e luminosidade. Entrega estética minimalista e elegante, padrão de cosméticos de luxo e marcas corporativas.
03 • INSPIRAÇÃO & CÓDIGOS HEX
Guia de Paleta de Cores: Combinações e Códigos HEX
Para criar paleta de cores marcante, escolha uma paleta de cores que combinam com a personalidade do projeto. Veja as principais cartelas:
Confiança & SerenidadeHEX
Paleta de Cores Azul
A paleta de cores azul é a campeã indiscutível de preferência corporativa. Comunica integridade moral, segurança de dados, clareza lógica e tranquilidade profissional. É o padrão de instituições financeiras, firmas de advocacia, seguradoras e empresas de software em nuvem.
#1E3A8A#2563EB#60A5FA#DBEAFE
Dica de uso: Harmoniza perfeitamente com acentos em laranja suave ou tons claros de bege e madeira.
Biofilia & Bem-EstarHEX
Paleta de Cores Verde
A paleta de cores verde simboliza vitalidade e renovação. Já a paleta de cores verde oliva confere sobriedade terrosa e refinamento militar para salas residenciais e moda outonal.
#283618#606C38#10B981#A3B18A
Dica de uso: O verde oliva casa com perfeição com tons de terracota e dourado suave envelhecido.
Argila & TradiçãoHEX
Paleta de Cores Terracota
A paleta de cores terracota resgata a argila cozida e paisagens mediterrâneas, oferecendo aconchego e toque artesanal sem o excesso do vermelho puro.
#8C3B2B#C05A46#E2725B#F4A261
Dica de uso: Una o terracota ao linho cru e a detalhes em verde sálvia para um visual deslumbrante.
Empatia & OtimismoHEX
Paleta de Cores Rosa & Coral
A paleta de cores rosa expressa empatia e afeto. Ao lado da paleta de cores coral, que traz o frescor do pôr do sol, forma cartelas encantadoras para cosméticos e moda.
#E11D48#FF6F61#FB7185#FCE7F3
Dica de uso: Combine coral e rosa blush com grafite profundo para obter contraste moderno de alto nível.
Quiet Luxury & SolidezHEX
Paleta de Cores Bege & Marrom
A paleta de cores bege e a paleta de cores marrom representam materiais nobres: couro, café, madeira e linho. Oferecem conforto visual e estética quiet luxury atemporal.
#4A2E1B#8C5E3C#D4B996#F5EDE0
Dica de uso: Misturar o bege com azul marinho compõe a consagrada cartela náutica clássica de alto prestígio.
Base Neutra & EstiloHEX
Paleta de Cores Cinza
A paleta de cores cinza é a base neutra por excelência. Na busca por paleta de cores que combinam com cinza, tons quentes como amarelo mostarda e terracota quebram a frieza com sofisticação.
#1F2937#6B7280#F59E0B#E5E7EB
Dica de uso: Aplique 60% de cinza claro nas paredes, 30% de grafite em móveis e 10% de mostarda em almofadas.
Leveza & IntrospecçãoHEX
Paleta de Cores Pastel & Lilás
A paleta de cores pastel reúne alta luminosidade e baixa saturação, evocando suavidade inocente. Integrada à paleta de cores lilas (tons de lavanda, lilás suave e ametista), fomenta a intuição, criatividade e sensação de relaxamento espiritual.
#C084FC#FBCFE8#BBF7D0#FEF08A
Dica de uso: Excelente para confeitarias artesanais, quartos infantis e marcas de bem-estar holístico.
Urgência & EntusiasmoHEX
Paleta de Cores Amarelo & Vermelho
A paleta de cores amarelo e a paleta de cores vermelho despertam fortes reações instantâneas. O amarelo ativa o intelecto e energia solar; o vermelho estimula apetite e conversões rápidas.
#B91C1C#EF4444#F59E0B#FDE047
Dica de uso: Utilize sobre fundos brancos ou neutros para assegurar leitura confortável e foco direto.
Pintura & Arquitetura BrasilSuvinil
Paleta de Cores Suvinil
A paleta de cores suvinil é a referência máxima para pintura de interiores e fachadas residenciais no Brasil. Tonalidades icônicas como Crômio (#B3B3B3), Elefante (#7B7973), Calopsita (#E5DFD3) e Terracota Suvinil foram desenvolvidas para dialogar com a luz natural brasileira.
CrômioElefanteCalopsitaTerracota
Dica de uso: Pinte as paredes principais com Crômio e crie uma parede de destaque aconchegante com Terracota Suvinil.
04 • METODOLOGIA DE DESIGN
Como Criar Paleta de Cores que Combinam: A Regra 60-30-10
Para criar paleta de cores sem erros, aplique a consagrada regra proporcional 60-30-10 do design:
60% • COR DOMINANTE
Fundo e Base Estrutural
Ocupa a maior área do projeto. Em websites, colore o fundo; em residências, tinge paredes principais e pisos, devendo ser suave para evitar cansaço visual.
30% • COR SECUNDÁRIA
Apoio e Hierarquia
Gera suporte e contraste equilibrado para cartões, menus, cortinas e sofás, mantendo diálogo harmônico com a base.
10% • COR DE ACENTO
Destaque Pontual
Extraída das cores complementares no círculo cromático. Reservada a botões de compra, links e pontos de ação.
Validação Automática de Acessibilidade (WCAG 2.1)
Verifique sempre o contraste na nossa ferramenta para garantir ratio mínimo de 4.5:1 (WCAG AA), assegurando leitura acessível.
Ratio 4.5:1 (AA)Ratio 7.0:1 (AAA)
05 • TABELA COMPARATIVA
Harmonias Cromáticas: Propriedades e Aplicações
Consulte as características ópticas e recomendações para cada harmonia:
Harmonia
Ângulo no Círculo
Nível de Contraste
Sensação Transmitida
Melhor Caso de Uso
Complementares
180° (Opostas)
Muito Alto
Energia vibrante e urgência
Botões de compra, alertas e pôsteres
Análogas
30° a 60° (Vizinhas)
Suave e Contínuo
Calma, natureza e fluidez
Spas, fundos de tela e quartos
Tríade
120° (Triângulo)
Equilibrado
Jovialidade e dinamismo
Ilustrações e marcas de entretenimento
Meio-Complementar
150° e 210°
Alto com Nuances
Sofisticação e riqueza visual
Revistas de moda e websites corporativos
Tétrade
Retângulo (4 Cores)
Muito Rico
Variedade e celebração
Infográficos multivariados e eventos
Monocromático
0° (Variações HSL)
Tonal / Gradiente
Luxo, pureza e minimalismo
Marcas premium, cosméticos e fintechs
←→Deslize a tabela para ver todas as colunas
06 • DÚVIDAS FREQUENTES
Perguntas Frequentes sobre Círculo Cromático e Cores
O que é um círculo cromático?
O círculo cromático é uma ferramenta geométrica circular que organiza as 12 cores principais (3 primárias, 3 secundárias e 6 terciárias). Ele permite visualizar relações de harmonia e contraste, como cores complementares e análogas, facilitando a criação de paletas para design, moda e decoração.
Para que serve o círculo cromático na vida real?
Serve para guiar escolhas visuais de maneira embasada e harmônica: designers gráficos o usam para compor marcas; estilistas para coordenar roupas e coloração pessoal; arquitetos na pintura e iluminação de interiores; e desenvolvedores para temas com contraste acessível.
O que são núcleos complementares?
O termo núcleos complementares designa os pares e pontos focais de cores opostas a 180 graus no círculo cromático. Eles representam eixos de contraste máximo, ativando mutuamente a vibração e intensidade óptica das tonalidades.
Quais são as cores complementares?
As cores complementares são aquelas situadas em lados opostos na roda cromática (180°). Os pares fundamentais são: Azul e Laranja, Vermelho e Verde, e Amarelo e Roxo (Violeta). No modelo RGB, incluem Ciano e Vermelho, e Magenta e Verde.
O que são cores complementares e como usá-las com equilíbrio?
Como exibem o contraste visual mais vigoroso, o truque para não sobrecarregar a visão é usá-las proporcionalmente: defina uma das cores em áreas amplas de sustentação (60-70%) e deixe a cor oposta reservada a pequenos acentos estratégicos e botões de ação.
Qual a diferença técnica entre os modelos RGB, CMYK e código HEX?
RGB é o modelo aditivo de luz para dispositivos digitais; CMYK é o modelo subtrativo de tintas físicas para impressoras e gráficas; e HEX é o código numérico hexadecimal de seis caracteres que indica aos navegadores a dosagem exata de vermelho, verde e azul na página.
Como garantir que a paleta de cores atenda à acessibilidade WCAG?
A norma internacional WCAG 2.1 estipula que textos normais devem atingir contraste de no mínimo 4.5:1 (nível AA) e textos grandes pelo menos 3.0:1 em relação ao fundo. Nossa ferramenta online calcula essas pontuações em tempo real para fundos claros e escuros.
Como saber minha paleta de cores?
Para descobrir sua paleta pessoal (coloração pessoal), analise o subtom da sua pele (quente, frio ou neutro), o contraste entre olhos, cabelo e pele, e a intensidade ideal de cor através do teste de tecidos das quatro estações (Primavera, Verão, Outono ou Inverno).
Como usar o círculo cromático para coordenar roupas no cotidiano?
Para looks equilibrados no dia a dia, use harmonia análoga combinando peças vizinhas, como calça verde-oliva com camisa azul-marinho. Para produções marcantes em ocasiões especiais, adote cores complementares inserindo a cor oposta em bolsas, cintos ou lenços.
Paleta de cores que combinam com cinza?
O cinza é um tom neutro versátil. Para ambientes aconchegantes, combine com amarelo mostarda, terracota e rosa queimado. Para composições modernas e sóbrias, harmonize com azul marinho, verde oliva, preto e branco.
Paleta de cores que combinam com bege?
O bege é uma base quente e nobre que combina com marrom chocolate, terracota, verde oliva e linho cru para um visual quiet luxury. Para criar contraste vivo e moderno, combine com azul marinho ou verde esmeralda.
Paleta de cores que combinam com verde musgo?
O verde musgo combina perfeitamente com terracota, mostarda, bege linho e tons amadeirados para uma estética terrosa e rústica chic. Para um contraste elegante e contemporâneo, combine com rosa seco ou off-white.
Paleta de cores que combinam com verde oliva?
O verde oliva combina com terracota, mostarda, bege linho, ferrugem e madeira natural. Para uma estética moderna e arrojada, use rosa blush ou azul petróleo em pequenos detalhes e acentos.
Paleta de cores que combinam com azul marinho?
O azul marinho harmoniza com caramelo, mostarda e terracota (cores quentes complementares). No estilo náutico e clássico, combina com branco puro, bege areia, cinza claro e toques de verde sálvia.
Paleta de cores que combinam com madeira escura?
Madeiras escuras como nogueira e jacarandá combinam com verde oliva, verde sálvia, bege fendi, terracota e cinza quente. Paredes em off-white e detalhes metálicos em dourado ou latão iluminam o espaço.
Paleta de cores que combinam com roxo?
O roxo harmoniza com amarelo mostarda (sua cor complementar direta), verde menta, lavanda suave, cinza claro e tons de rosa seco. Em composições sofisticadas, combina com dourado e madeiras claras.
Como usar as paletas de cores inspiradas nas tintas Suvinil na decoração?
Tons Suvinil como Crômio, Calopsita, Elefante e Terracota combinam com a regra 60-30-10: aplique os neutros acinzentados nas paredes principais (60%), tons amadeirados nos móveis (30%) e cores vivas ou terracota em adornos e almofadas (10%).