Ir para o conteúdo
TextArray
Totalmente local

Conversor de unidades CSS

Converta comprimentos CSS entre px, rem, em, pt e% em qualquer tamanho de fonte raiz.

Entrada
Saída

Conversor de unidades CSS

Cole os valores CSS um por linha – 16px, 1,5rem, 12pt, 150% – e este conversor os traduz instantaneamente. Um número simples é lido na unidade definida pela seleção From, enquanto uma unidade escrita na linha sempre vence, para que você possa misturar pixels e rems em uma lista. Escolha um alvo em Até ou escolha Todas as unidades para ver toda a cadeia rapidamente: 16px = 1rem = 12pt = 100%. Linhas que não são valores simples passam inalteradas, portanto, um comentário perdido nunca interrompe a execução.

A matemática depende de um número: o tamanho base, o tamanho da fonte raiz em pixels. O padrão dos navegadores é 16px, e é por isso que 1rem geralmente é igual a 16px e 100% é igual à base. Defina a base como 10 para o truque clássico de 62,5%, onde 1,5rem é 15px, ou combine um sistema de design com uma raiz diferente. Os pontos são fixados pelo próprio CSS - 1px é 1/96 de polegada e 1pt é 1/72, então 16px é exatamente 12pt, independentemente da base. A opção de decimais limita a precisão em até seis casas, com zeros à direita aparados.

Rem é a unidade de fácil acessibilidade: ela é dimensionada de acordo com a preferência de tamanho de fonte do navegador do leitor, de modo que o texto definido em rem aumenta quando alguém aumenta seu tamanho padrão, enquanto px permanece fixo. Em usa a mesma matemática aqui, mas em uma folha de estilo real ela é relativa ao tamanho da fonte do próprio elemento, portanto os valores em aninhados são compostos onde rem não o faz - este conversor assume o caso plano relativo à raiz.

Tudo é executado localmente no seu navegador – nada é carregado e não há nada pelo que esperar. Copie a lista convertida ou baixe-a como um arquivo .txt.

FAQ

Por que usar rem em vez de px?
Os valores Rem são dimensionados de acordo com o tamanho da fonte que o leitor define em seu navegador, para que as pessoas que precisam de texto maior realmente o consigam. Os valores Px ignoram essa preferência. Converter um design baseado em px em rem é uma das vantagens de acessibilidade mais baratas que existe.
Qual é o tamanho base e por que o padrão é 16?
É o tamanho da fonte raiz em pixels – a que se referem 1rem, 1em e 100%. Todos os principais navegadores vêm com um padrão de 16px, então 16 é a base correta, a menos que sua folha de estilo altere a raiz, por exemplo html { font-size: 62.5% } que torna a base 10.
Qual é a diferença entre em e rem?
Rem é sempre relativo ao tamanho da fonte raiz; em é relativo ao elemento atual, então os valores em aninhados se multiplicam. Este conversor trata ambos em relação ao tamanho de base único – o case plano. Na marcação profundamente aninhada, os valores em reais podem ser diferentes.
O que acontece com linhas que não são valores?
Eles passam para a saída inalterados e a contagem os conta como ignorados. Somente valores simples como 16px, 1,5rem ou um número simples são convertidos — declarações CSS completas estão fora do escopo.
Meu texto é carregado em algum lugar?
Não. A ferramenta funciona inteiramente no seu navegador e sua entrada nunca sai do seu dispositivo.