Softonic

Conversor RGB para HSV

Etapa 1 / 2
Resultados

HSV (matiz, saturação, valor) é o espaço de cor por trás da maioria dos seletores de cores estilo Photoshop, o grande quadrado onde a matiz está na lateral e a saturação e brilho preenchem a área principal. Este conversor transforma RGB em HSV para que você possa pensar em “qual matiz, quão colorido, quão brilhante”, da maneira que pintores e bibliotecas de processamento de imagem costumam preferir.

Como a conversão funciona

  1. 1

    Insira RGB 0–255

    Qualquer tripla sRGB padrão. Internamente, a ferramenta normaliza para 0–1.

  2. 2

    Calcule o valor

    V = max(R, G, B). Zero se todos os canais forem zero.

  3. 3

    Calcule a saturação

    S = (max − min) / max. Zero para cinzas; 1 para matizes puras.

  4. 4

    Calcule a matiz

    Derivada de qual canal é dominante e as forças relativas. Expressa em graus 0–360.

Referência rápida

RGB HSV
255, 0, 0 hsv(0°, 100%, 100%)
0, 255, 0 hsv(120°, 100%, 100%)
0, 0, 255 hsv(240°, 100%, 100%)
255, 255, 0 hsv(60°, 100%, 100%)
128, 128, 128 hsv(0°, 0%, 50%)
200, 100, 50 hsv(20°, 75%, 78%)
70, 130, 180 hsv(207°, 61%, 71%)

HSV vs HSL

Ambos compartilham o canal de matiz. A diferença:

  • HSV: a saturação controla “quanto da matiz vs branco”; o valor controla “quanto da matiz pura está presente”. O V máximo é sempre a matiz pura.
  • HSL: a luminosidade vai de preto → matiz pura → branco. O L máximo é sempre branco.
HSV(120, 100%, 100%)  → verde puro
HSL(120, 100%, 100%)  → branco

HSV é o que você vê no Photoshop, GIMP, Procreate: um quadrado onde você escolhe a saturação no eixo x e o valor no eixo y, com a matiz ao longo da borda. HSL se adapta melhor ao tema CSS porque escurecer é apenas diminuir L.

Quando HSV é a escolha certa

  • Processamento de imagem. A limitação por matiz é mais fácil em HSV; o padrão do OpenCV é HSV para segmentação.
  • Pintura e ilustração. Artistas pensam em “escolher uma cor, agora mais escura / mais clara” que se mapeia no eixo de valor do HSV.
  • Interfaces de seleção de cores. O controle quadrado-plus-faixa usa nativamente HSV.
  • Correspondência de cores difusa. “Este pixel é avermelhado?” se torna uma verificação de faixa de matiz, que é trivial em HSV e complicada em RGB.

Quando HSL é a escolha certa

  • Variáveis CSS e temas. Escurecer uma paleta diminuindo L é previsível.
  • Tons e sombras programáticas. Uma paleta de 10 etapas da mesma matiz é mais limpa em HSL.
  • Contraste de acessibilidade. L aproxima a luminosidade percebida ligeiramente melhor que V.

Casos extremos

  • A matiz de cinzas puras é indefinida. Quando a saturação é 0, a matiz não tem significado; a maioria das implementações retorna 0 como padrão.
  • Precisão de ponto flutuante. A conversão RGB → HSV → RGB pode variar em 1/255 em um canal. Compare com tolerância se precisar de igualdade exata.
  • Entradas não lineares. sRGB é codificado em gama; o HSV conforme calculado aqui funciona em valores codificados em gama, não em luz linear. Para trabalho de cor fisicamente preciso, converta para RGB linear primeiro.

Folha de dicas

  • Dessaturar: mantenha H e V, defina S mais baixo.
  • Clarear enquanto preserva a matiz: aumente V (permanece colorido, fica mais claro em direção à matiz pura).
  • Para clarear em direção ao branco: converta para HSL e aumente L; HSV sozinho não fará isso.

Perguntas frequentes

Não. O CSS suporta nativamente hex, rgb(), hsl(), hwb(), lab(), lch(), oklch(). Use HSV dentro da sua ferramenta de design, depois exporte hex ou hsl() para o navegador.

Não. Um amarelo “brilhante” em HSV parece muito diferente de um azul “brilhante” mesmo com o mesmo V. Para uniformidade perceptual, use LCh ou OKLCh.

O seletor de cores quadrado-plus-faixa se mapeia naturalmente para HSV: matiz na faixa, saturação no eixo x do quadrado, valor no eixo y. Isso corresponde à forma como os pintores pensam sobre a mistura de pigmento com branco/preto.

Alfa é geralmente um quarto canal (HSVA) em vez de parte do espaço principal. A maioria das bibliotecas apenas mantém o alfa inalterado durante as conversões HSV.

Matematicamente é sem perda, mas a conversão de 8 bits pode variar em uma unidade devido ao arredondamento. Use floats de maior precisão se precisar de igualdade exata.

Ferramentas relacionadas

Gerador de Cartão CSS

Crie o CSS de um contêiner de cartão: fundo, borda, raio dos cantos, espaçamento interno e sombra suave, com pré-visualização imediata e código para copiar e colar.

Conversor de Tamanho de Arquivo

Converta entre bytes, KB, MB, GB, TB e as unidades binárias IEC (KiB, MiB, GiB, TiB), combinando decimal e binário como preferir.

Gerador de Docker Compose

Gere um docker-compose.yml a partir de definições de serviços com imagem, portas e volumes, com padrões de boas práticas.

Conversor de base numérica

Converta números entre binário, octal, decimal, hexadecimal e qualquer base personalizada de 2 a 36, com o detalhamento posicional.

Visualizador de Markdown

Escreva Markdown e veja a renderização HTML atualizar ao vivo. Sintaxe com estilo GitHub, incluindo tabelas, listas de tarefas, blocos de código cercados e autolinks.

Gerador de Configuração Nginx

Gere blocos de servidor Nginx com TLS, HTTP/2, gzip, cache de navegador e regras de proxy reverso a partir de um formulário simples.

Ferramenta disponível em outros idiomas