Seletor de cores online
Escolha cores de qualquer imagem. Clique para extrair valores HEX, RGB e HSL. Gratuito, privado e instantâneo — tudo roda no seu navegador.
100% Privado — Seus arquivos nunca saem do seu dispositivo. Todo o processamento acontece no seu navegador.
Solte sua imagem aqui
ou clique para selecionar — JPG, PNG, WebP suportados
Clique em qualquer lugar da imagem para escolher uma cor
Como funciona o seletor de cores?
Esta ferramenta usa a API Canvas integrada ao seu navegador para ler a cor do pixel na posição exata onde você clica. Depois converte os valores RGB para formatos HEX e HSL. Todo o processo é executado localmente no seu dispositivo — suas imagens nunca são enviadas para nenhum servidor.
Tips for Using the Color Picker
- Use the magnifier for precision — The built-in magnifier zooms in on the area around your cursor for exact pixel selection.
- Build a palette from a reference image — Drop an inspiring photo and click on different areas to extract a complete color palette.
- Copy color values with one click — Click on any color swatch to copy its HEX value to your clipboard instantly.
- Compare HEX, RGB, and HSL side by side — Each picked color displays in all three formats simultaneously.
- Pick colors from screenshots — Take a screenshot of any application and drop it in to extract exact color values.
- Clear and start fresh for new projects — Use "Clear all" to reset your palette when switching between images.
When to Use the Color Picker
- Web development — Extract exact HEX color codes from design mockups or screenshots to use in your CSS.
- Brand identity work — Identify the precise colors in a logo or brand material for style guides.
- Interior design and decoration — Pick colors from inspiration photos to get exact values for mood boards.
- Digital art and illustration — Sample colors from reference images for accurate color palettes.
- Accessibility testing — Extract foreground and background colors to check contrast ratios against WCAG guidelines.
Perguntas frequentes
Quais formatos de cor são fornecidos?
Cada cor escolhida mostra valores HEX (ex: #FF5733), RGB (ex: rgb(255, 87, 51)) e HSL (ex: hsl(11, 100%, 60%)). Clique em qualquer valor para copiá-lo para a área de transferência.
Quão precisa é a seleção de cores?
A ferramenta lê o valor exato do pixel no ponto em que você clica, fornecendo a cor precisa da imagem. Para melhores resultados, amplie a área que deseja amostrar.
Posso escolher várias cores?
Sim! Cada clique adiciona uma nova cor à sua paleta. Todas as cores escolhidas são exibidas com seus valores HEX, RGB e HSL. Use "Limpar tudo" para recomeçar.
How does the magnifier help with color picking?
The magnifier displays a zoomed-in view of the pixels around your cursor, showing each individual pixel clearly. This lets you pick the exact color you want, even from tiny details like 1-pixel borders, small text, or fine gradients. Without magnification, it's easy to accidentally pick an adjacent color.
How do I copy a color value?
Click on any color swatch in your picked palette to copy its HEX value to your clipboard. The HEX, RGB, and HSL values are all displayed for each color, so you can also manually select and copy the specific format you need for your project.
Can I use the color picker for web design work?
Absolutely! The color picker is ideal for web design. Extract colors from client brand materials, competitor sites, or design inspiration images. The HEX values can be pasted directly into CSS, and the RGB values work in design tools like Figma, Sketch, and Photoshop.
Can I check color contrast for accessibility?
While ImgLab's color picker doesn't calculate contrast ratios directly, you can use it to extract the exact HEX values of foreground text and background colors from any UI screenshot. Then paste those values into a dedicated contrast checker tool to verify WCAG 2.1 compliance (4.5:1 for normal text, 3:1 for large text).