Categoria: Desenvolvimento

Conversor de unidades CSS

Ideia nossaFalta uma ferramenta?

Converta px, rem, em, %, vw e vh

Informe um valor em px, rem, em, porcentagem, vw ou vh, além do tamanho de fonte base, do viewport e do contêiner de referência, e obtenha a mesma medida em todas as outras unidades.

px16rem1em1%5vw1.25vh2.222

A conversão acontece na página, a partir dos números que você digita. Nada é enviado a lugar nenhum.

Tudo nesta página é processado no seu navegador. Nada é enviado.

Para que serve

Um valor em pixels se converte para rem sempre da mesma forma, mas porcentagem, vw e vh não: eles dependem de um tamanho de contêiner ou de um viewport que muda de página para página. Esta ferramenta pede esse contexto logo de início, então os números que ela devolve são os que realmente seriam renderizados, e não um palpite genérico baseado em uma raiz de 16px. Aqui, rem e em são tratados da mesma forma, ambos escalados a partir do tamanho de fonte base informado, já que, sem um elemento pai real na página, não há como diferenciá-los por um tamanho de pai separado. Mude o tamanho de fonte base para ver como o ajuste de texto ampliado de um visitante desloca todos os valores em rem e em de uma vez.

Como usar

  1. Informe o valor e escolha a unidade de origem.
  2. Defina o tamanho de fonte base, a largura e a altura do viewport, e o tamanho do contêiner de referência.
  3. Veja a mesma medida convertida em todas as outras unidades.

Privacidade

Esta ferramenta roda inteiramente no seu navegador. O que você digita nunca é enviado, salvo ou compartilhado — fechar a aba já remove tudo.

Perguntas frequentes

Por que rem e em dão o mesmo resultado?
Os dois são escalados a partir de um tamanho de fonte base. O rem sempre usa o tamanho da raiz e o em usa o do elemento pai, mas esta ferramenta não tem uma página real de onde ler um pai, então usa o tamanho base informado para os dois.
Para que serve o tamanho do contêiner?
É a referência da porcentagem: uma porcentagem só faz sentido em relação a algo, e aqui esse algo é o tamanho de contêiner que você informa.
Algo é enviado a um servidor?
Não. A conversão é calculada na página a partir dos números que você digita.