Conversor de unidades CSS
Opções de unidade
rem usa o tamanho de fonte base. em e% usam o tamanho pai. vw e vh usam a largura e a altura da janela de visualização.
Visualização ao vivo
Sobre o conversor de unidades CSS
CSS Unit Converter ajuda a converter unidades CSS comuns como px, rem, em,%, vw e vh. É útil ao adaptar tipografia, espaçamento, pontos de interrupção e layouts responsivos.
Você pode alterar o tamanho da fonte base, o tamanho pai, a largura e a altura da janela de visualização para corresponder ao contexto do seu projeto, em vez de depender de suposições fixas.
Como usar
- Insira o valor que deseja converter.
- Escolha as unidades CSS de origem e de destino.
- Ajuste o tamanho da fonte base, o tamanho principal ou os valores da janela de visualização quando necessário.
- Copie o valor convertido ou regra CSS.
Dicas
- Use 16px como tamanho base padrão comum para conversões rem.
- Use o tamanho pai ao converter valores em ou percentuais.
- Use a largura da janela de visualização para vw e a altura da janela de visualização para conversões vh.
- Verifique a visualização para entender a escala visual do valor convertido.
Verificações ao converter unidades CSS
Valores visualmente iguais nem sempre são equivalentes: unidades relativas dependem de fontes, viewport, containers ou propriedades.
Identifique a referência
Confirme se porcentagens, em, rem, viewport e container units dependem do pai, raiz, elemento ou query container.
Evite falsa precisão
Arredonde apenas o necessário e verifique se o erro acumulado afeta grids, transforms ou dimensões repetidas.
Teste o comportamento responsive
Compare o resultado entre breakpoints, orientação, alterações da interface do navegador, zoom e tamanhos raiz.
Escolha unidades pela intenção
Use unidades que expressem a relação necessária em vez de converter tudo em pixels porque hoje parece igual.
Ferramentas relacionadas
Você também pode achar essas ferramentas úteis.