Ir para o conteúdo
Logo do CrateX.app

CrateX.app

Conversor de unidades CSS

Conversor de unidades CSS

Conversor de unidades CSS: Suporta conversão entre unidades CSS como px, em, rem, %, vw, vh, fornecendo configurações de ponto de interrupção responsivo. Calcula automaticamente valores dependentes do contexto, adequado para desenvolvimento de layout responsivo, implementação de frontend e adaptação de estilo.

Pixels
px
Toque para alternar a unidade

Length Units

Typography

Viewport

Percentage

Relativo ao tamanho de fonte raiz
rem
Toque para alternar a unidade

Length Units

Typography

Viewport

Percentage
Conversor de unidades CSS

Início rápido

1
Introduzir valor e unidade: p.ex., 16 + px ou 1 + rem
2
Escolha a Origem e digite o valor; depois a Destino. Use “Trocar” para alternar rápido.
3
Mobile: seta no canto superior direito do drawer para alternar Origem/Destino.
4
Disponível para rem/em/%/vw/vh; desativado em unidades absolutas.
5
Ver resultados: as restantes unidades são calculadas instantaneamente e podem ser copiadas
6
Breakpoints: alternar móvel/tablet/desktop para validar em diferentes telas

Cenários comuns

Utilização

layouts responsivos, passagem design‑→dev, correlação densidade/impressão, unificação de convenções

Cenário adicional

rem to px, em conversor e viewport units podem ser tratados no mesmo fluxo para conferir o resultado antes de copiar ou exportar.

Dicas de uso

Definir base: 16px na raiz é comum e facilita contas rem ↔ px
Texto em rem: permite escala global e acessibilidade; em para escala local em componentes
Layout com viewport: combinar com breakpoints e clamp/min/max para evitar extremos
Decimais e arredondamento: manter precisão razoável para boa legibilidade

Parâmetros e contexto

REM base (Root Font Size): determina rem ↔ px. 16px é comum (1rem≈16px). Ajuste quando a base do design for diferente.
EM base (Parent Font Size): determina em e % (quando a referência é Tamanho de letra). Útil para escala local do componente.
Referência de %: escolha Tamanho de letra / Largura / Altura conforme o contexto (layout vs tipografia).
Presets de breakpoint definem também o tamanho do viewport para estimativas rápidas (não é media query em runtime).
Tamanho de viewport para vw/vh/vmin/vmax e % (largura/altura). Dispositivos variam por barras/zonas seguras/scrollbars.
DPI (pontos por polegada): para pt/pc/in/cm/mm/q ↔ px. Padrão 96; impressão/HiDPI use o valor do dispositivo.
Dicas: 1) use 16px e 96 DPI como base; 2) valide % de layout alternando breakpoints; 3) estimativa de projeto, não substitui o cálculo final do navegador.

Limitações e compatibilidade

% depende da propriedade (width/height/line-height diferem); a ferramenta estima casos comuns
ex/ch dependem de métricas da fonte; variam entre fontes/navegadores
Unidades de viewport variam com barras/zonas seguras; admita pequenas discrepâncias
Unidades físicas ↔ px variam com o DPI; em impressão/HiDPI valide com cuidado

Privacidade e segurança

Todo o processamento acontece localmente no navegador. Você pode substituir, limpar e processar novamente o conteúdo a qualquer momento.

Perguntas frequentes

4

Continue com estas ferramentas relacionadas na próxima etapa.