IA no seu dispositivo — profissional e privado.

Ferramenta Color Picker

Escolha uma cor e copie-a em doze formatos, sem enviar nada.

  • Funciona no seu dispositivo
  • Doze formatos de uma vez
  • Contraste e daltonismo

Solte uma folha de estilos ou um arquivo de tokens

CSS, SCSS, SASS, LESS, JSON, SVG ou TXT — até 10.0 MB

#FF4D4D

Nome de cor mais próximo: tomato (Mesma família, distância 6.4)

  • HEX#FF4D4D
  • RGBrgb(255 77 77)
  • HSLhsl(0 100% 65.1%)
  • HWBhwb(0 30.2% 0%)
  • HSVhsv(0 69.8% 100%)Não é CSS
  • CMYKcmyk(0% 69.8% 69.8% 0%)Não é CSS
  • LABlab(59.906 67.771 41.299)
  • LCHlch(59.906 79.363 31.36)
  • OKLABoklab(0.673 0.19441 0.09082)
  • OKLCHoklch(0.673 0.21457 25.04)
  • Display P3color(display-p3 0.9239 0.3574 0.3319)
  • XYZ D65color(xyz-d65 0.45232 0.27107 0.09872)

Contraste

Sobre branco3.27:1
Aa
  • AA normalFalha
  • AA grandePassa
  • AAA normalFalha
  • AAA grandeFalha
Sobre preto6.42:1
Aa
  • AA normalPassa
  • AA grandePassa
  • AAA normalFalha
  • AAA grandePassa
Sobre a sua cor3.27:1
  • AA normalFalha
  • AA grandePassa
  • AAA normalFalha
  • AAA grandeFalha

Tom mais próximo que passa — #E22D35 atinge 4.51:1 em relação à sua cor de comparação.

Visão da cor

Como esta cor aparece para pessoas com cada tipo de deficiência de visão da cor.

  • Visão típica
  • Protanopia
  • Deuteranopia
  • Tritanopia
  • Sem visão da cor
O que você está convertendo?
Valor de cor

Qualquer sintaxe de cor CSS, mais cmyk() e hsv().

Editar canais em

Os valores que você digitar aqui são mantidos, mesmo quando a cor não tem matiz onde mostrá-los.

Comparar com
Exportar
Exportar como
Cores recentes
As cores que você converter aparecem aqui.

Como escolher e copiar uma cor

  1. Selecionar cor

    Use o seletor ou controles — a pré-visualização se atualiza em tempo real.

  2. Ver todos os formatos

    RGB, HEX, HSL e CMYK são mostrados. Altere qualquer campo para atualizar os outros.

  3. Copiar valores

    Clique em Copiar ao lado de um formato para colar no projeto ou ferramenta de design.

Por que usar um seletor de cor?

Um seletor permite escolher visualmente, converter formatos, pré-visualizar em tempo real e acessar valores úteis em design e desenvolvimento.

Vantagens

  • Seleção visual: Interface interativa para escolher a cor
  • Conversão: Entre RGB, HEX, HSL e CMYK
  • Pré-visualização imediata: Ver mudanças na hora
  • Informação: Valores detalhados da cor
  • Projetos: Para design e desenvolvimento

Como funciona

O nosso seletor usa algoritmos de seleção e conversão para resultados precisos. Suporta vários formatos e pré-visualização em tempo real.

Funcionalidades

  • Seleção interativa: Escolher cor visualmente
  • Vários formatos: RGB, HEX, HSL e CMYK
  • Conversão em tempo real: Atualização instantânea
  • Pré-visualização: Ver a cor escolhida
  • Copiar: Copiar valores com facilidade

Escolher uma cor e salvá-la

Um seletor só é útil se a cor escolhida puder sair da página na forma que a ferramenta seguinte espera. É em torno disso que este foi construído.

  • Todos os formatos de uma vez — Uma escolha produz HEX, RGB, HSL, HWB, HSV, CMYK, LAB, LCH, OKLAB, OKLCH, Display P3 e XYZ, além do nome CSS mais próximo e da distância real.
  • Ou escreva um valor — O seletor e a caixa de texto são duas entradas para a mesma cor. Cole o que o CSS entender e a amostra acompanha.
  • As cores recentes ficam salvas — As últimas doze cores escolhidas ficam no painel, apenas neste dispositivo, para comparar duas candidatas sem reescrever nenhuma.
  • Verifique antes de usar — Contraste contra branco, preto ou a cor que escolher, e uma simulação de como fica para quem tem cada tipo de deficiência de visão de cor.

Quando usar

Quando precisar de escolher cores visualmente, converter formatos, pré-visualizar ou obter valores para projetos.

Casos ideais

  • Desenvolvimento web: Cores para sites e aplicativos
  • Projetos de design: Escolher paletas e tons
  • Pesquisa de cor: Explorar opções
  • Conversão: Mudar entre formatos
  • Correspondência: Aproximar cores de imagens ou layouts

Fatos

Ajuda a aproveitar melhor a ferramenta.

Pontos-chave

  • Os seletores abrangem milhões de combinações
  • Vários formatos cobrem web, impressão e design
  • A conversão em tempo real mantém a representação consistente
  • A seleção interativa torna o fluxo intuitivo
  • A pré-visualização apoia a decisão

Boas práticas

Orientações para melhores resultados.

Qualidade

  • Use telas de boa qualidade para seleção mais precisa
  • Considere espaço de cor e gamut
  • Teste cores no aplicativo de destino
  • Verifique a exatidão dos valores
  • Pense em acessibilidade e contraste

Limitações

  • Evite telas fracas para trabalho crítico de cor
  • Não dependa só da tela em projetos de impressão
  • Se precisar de correspondência exata, use ferramentas profissionais
  • Com perfis ICC obrigatórios, valide no fluxo profissional

Limitações e compatibilidade

A calibração da tela e diferenças entre dispositivos afetam a percepção; confirme no meio final se a precisão for crucial.

Com algoritmos otimizados de processamento de imagem.

Os outros conversores de cor

Perguntas frequentes

Como funciona o seletor de cor?

Arraste o seletor ou mova os controles para escolher uma cor, e a pré-visualização se atualiza em tempo real. À medida que você seleciona, a ferramenta calcula de imediato os valores RGB, HEX, HSL e CMYK correspondentes, e editar qualquer campo recalcula os outros para que todos descrevam a mesma cor.

Que formatos de cor mostra?

Para cada cor escolhida, a ferramenta mostra quatro formatos lado a lado: RGB e HEX para telas e CSS, HSL para ajustar matiz e luminosidade de forma intuitiva, e CMYK como guia para impressão. Os quatro se mantêm sincronizados e se atualizam assim que você muda a cor selecionada.

Posso usar as cores escolhidas em CSS?

Sim. Cada formato tem o seu próprio botão de copiar, por isso você pode obter o código HEX ou a string rgb() e colá-la diretamente em CSS ou HTML. O HSL também está pronto para a função hsl() do CSS, e os valores CMYK dão às equipes de impressão e branding os números de que precisam.

As minhas cores ficam privadas?

Sim. O seletor roda inteiramente no seu dispositivo, por isso as cores que você escolhe e os valores gerados nunca são enviados nem salvos num servidor. Tudo roda no seu dispositivo, não nos nossos servidores, o que mantém as paletas de marca e as cores de projetos não publicados totalmente privadas.

O seletor de cor funciona em celular?

Sim. Funciona em qualquer dispositivo moderno em desktop, tablet e celular, com controles aptos para toque para arrastar o seletor e os controles com o dedo. O layout se adapta a telas pequenas, e copiar valores funciona da mesma forma que no desktop.

O seletor de cor é gratuito e funciona offline?

Sim. O seletor é totalmente gratuito, sem marcas d'água nem limites de uso. Como toda a conversão é no seu dispositivo, continua funcionando sem conexão com a internet assim que a página carrega, o que o torna prático para combinar cores rapidamente em qualquer lugar.

4.8de 5

de 521 avaliações

Avalie esta ferramenta

Toque numa estrela — leva um segundo