Seletor de cores simples

Seletor de cores grátis para Chrome

Pegue a cor de qualquer página. Receba #E8553D

O Seletor de cores simples é um conta-gotas grátis para o Chrome. Clique no botão ou pressione Alt+P, mire em um pixel pela lupa e clique: o código HEX, RGB ou HSL já está na área de transferência. Suas últimas 50 cores ficam no popup.

Adicionar ao Chrome — grátis

453 usuários na Chrome Web Store

Também funciona no Edge, Brave, Opera e em outros navegadores baseados em Chromium.

A lupa quadrada sobre um pôster em uma página enquadra um pixel com seu HEX, RGB e HSL, ao lado do popup do Seletor de cores simples com #E8553D e um histórico de cores

Resumo

O que faz
Um seletor de cores tipo conta-gotas: mire em qualquer pixel de uma página por uma lupa, clique, e o código HEX, RGB ou HSL é copiado.
Para quem é
Desenvolvedores web e designers que pegam cores de sites no ar, layouts e capturas de tela abertos no navegador, e qualquer pessoa que precise de um código de cor.
Preço
Grátis. Sem conta, sem versão paga.
Dados
Seu histórico e o formato padrão ficam no armazenamento local da extensão, no seu dispositivo. Sem análises, sem requisições de rede.
Funciona em
Chrome e outros navegadores Chromium que instalam pela Chrome Web Store, no computador. Não funciona em páginas do navegador, como a nova guia, as configurações ou a Chrome Web Store.
Limites
Escolhe a partir da parte visível da guia, usando uma captura feita quando você inicia. Sem CMYK, Pantone ou verificação de contraste, e sem escolher cores fora do navegador.
Versão
2.7.0, atualizada em 23 de outubro de 2026

Três passos, um clique

  1. 1

    Inicie o seletor

    Clique no ícone da barra de ferramentas e em Escolher uma cor, ou pressione Alt+P em qualquer página.

  2. 2

    Mire com a lupa

    Uma lupa quadrada amplia a área ao redor do cursor e enquadra o pixel exato. Uma etiqueta abaixo mostra HEX, RGB e HSL em tempo real.

  3. 3

    Clique e cole

    O código é copiado no formato padrão e um aviso curto confirma. Cole no CSS, no Figma ou em uma mensagem.

Quem usa

CSS

Front-end

Pegue valores exatos de um site no ar para CSS, SCSS ou uma configuração do Tailwind sem abrir o DevTools.

HEX

Design e marca

Colete uma paleta de uma interface, de um layout ou de uma referência e confira se a página usa a cor certa da marca.

HSL

Ajuste de cores

Use HSL para ajustar luminosidade e saturação à mão, ou RGB para código que pede números.

O que faz

  • pixel, enquadrado

    A lupa amplia 11 × 11 pixels ao redor do cursor e uma mira enquadra o que você vai pegar. Acerte uma borda de um pixel ou um único degrau de um gradiente.

  • formatos

    HEX como #2A6FDB, RGB como rgb(42, 111, 219), HSL como hsl(217, 71%, 51%). Escolha o formato padrão uma vez no popup.

  • cores no histórico

    Cada cor escolhida vai para o início de uma grade com as últimas 50, sem duplicatas. Clique em uma amostra para ver e copiar os três códigos.

  • Atalho Alt+P

    Comece a escolher sem abrir o popup. A tecla no popup abre as configurações de atalhos do Chrome, se você quiser outra.

  • requisições de rede

    Tudo roda no seu navegador. Sem conta, sem análises, sem telemetria.

  • Claro e escuro

    O popup e a lupa seguem o tema do sistema, em cinzas neutros que não alteram as cores que você avalia.

Como descobrir o código de cor de qualquer coisa na página

O conta-gotas do próprio Chrome fica dentro do DevTools: abra o painel Estilos, encontre uma propriedade de cor, clique na amostra e depois no conta-gotas. Funciona, mas é escondido, e o valor escolhido substitui essa propriedade no CSS da página em vez de ir para a área de transferência.

O Seletor de cores simples coloca um conta-gotas a um clique ou a um atalho de distância. Ao iniciar, ele captura a parte visível da guia e abre uma lupa quadrada sobre ela, para você ver o pixel exato, não uma média. Um clique copia o código, e o popup o guarda com suas últimas 50 cores nos três formatos.

Role até a parte da página de que você precisa antes de iniciar: a lupa lê dessa captura. Páginas do navegador, como a nova guia, as configurações e a Chrome Web Store, são fechadas para qualquer extensão.

Privado por princípio

  • Sem requisições de rede

    A extensão nunca fala com um servidor. Sem análises, sem telemetria.

  • Fica no seu dispositivo

    Seu histórico e o formato padrão ficam no armazenamento local da extensão.

  • Quatro permissões

    A guia ativa, só quando você inicia uma escolha, para fazer a captura; scripting para mostrar a lupa; armazenamento para histórico e formato; escrita na área de transferência para copiar o código.

Conta-gotas do DevTools vs Seletor de cores simples

Conta-gotas do DevTools vs Seletor de cores simplesConta-gotas do DevToolsSeletor de cores simples
Como iniciarAbra o DevTools, encontre uma cor em Estilos, clique na amostra e depois no conta-gotasBotão da barra de ferramentas ou Alt+P
O resultado vai paraA propriedade CSS que você abriu; você copia por conta própriaSua área de transferência, ao clicar
Formatos de corHEX, RGB, HSL e outrosHEX, RGB e HSL
Cores escolhidas antesNão são guardadasAs últimas 50, prontas para copiar de novo
PreçoIntegrado ao ChromeGrátis

Perguntas

Como pego o código de cor de um site?

Instale o Seletor de cores simples, pressione Alt+P na página, mire a lupa na cor e clique. O código HEX, ou RGB ou HSL se preferir, é copiado para a área de transferência.

Como escolho uma cor de uma imagem em uma página?

Do mesmo jeito: inicie o seletor e clique no pixel que quer na imagem. A lupa amplia, então você pega um pixel exato.

Posso copiar HSL ou RGB em vez de HEX?

Sim. Escolha o formato padrão no popup: HEX, RGB ou HSL. O popup também mostra os três para qualquer cor do histórico, cada um com seu botão de copiar.

Onde encontro as cores que escolhi antes?

Abra o popup: suas últimas 50 cores estão lá como amostras, das mais novas para as mais antigas. Clique em uma para ver e copiar os códigos, ou limpe o histórico.

Como mudo o atalho Alt+P?

Clique na tecla do atalho no popup. Ela abre a página de atalhos de teclado do Chrome, onde você define outra tecla.

Por que não funciona em algumas páginas?

O Chrome fecha as próprias páginas, como a nova guia, as configurações e a Chrome Web Store, para todas as extensões. O seletor também lê só a parte visível da guia, então role até a cor antes.

Ele escolhe cores fora do navegador?

Não. Escolhe apenas da guia atual do navegador. Também não converte para CMYK ou Pantone nem verifica contraste.

É grátis? Coleta dados?

É grátis e não faz requisições de rede. Seu histórico e o formato padrão ficam no seu dispositivo.

Mais extensões grátis da PYROCTAL

Mire. Clique. Cole.

Adicionar ao Chrome — grátis