Conversor Em/Px

Converta entre unidades CSS: px, em, rem, pt e %. Defina seu tamanho de fonte base e veja todas as conversões instantaneamente com uma tabela de referência rápida.

Base Font Size

px(browser default: 16px)

Convert a Value

px
16
em
1
rem
1
pt
12
%
100

Text Preview

The quick brown fox

Previewing at 16px

Quick Reference TableBase: 16px

pxemrempt%
80.50.5650%
100.6250.6257.562.5%
120.750.75975%
140.8750.87510.587.5%
161112100%
181.1251.12513.5112.5%
201.251.2515125%
241.51.518150%
281.751.7521175%
322224200%
362.252.2527225%
402.52.530250%
483336300%
644448400%
724.54.554450%
966672600%

All conversions happen entirely in your browser. No data is sent to any server.

Como Usar Conversor Em/Px

  1. 1Defina seu tamanho de fonte base (padrão 16px).
  2. 2Digite um valor e selecione a unidade de entrada.
  3. 3Veja conversões para todas as outras unidades CSS instantaneamente.
  4. 4Use a tabela de referência para tamanhos de fonte comuns.
ZenovayAnalytics

Transforme seu tráfego em clientes.

  • Acompanhamento de visitantes em tempo real
  • Privacidade em primeiro lugar, sem banner de cookies
  • Configurado em dois minutos
Conheça o Zenovay

Perguntas Frequentes

Qual é a diferença entre em, rem e px?
px (pixels) é uma unidade absoluta baseada em pixels de tela. em é relativo ao tamanho da fonte do elemento pai. rem é relativo ao tamanho da fonte do elemento raiz (html). Com uma raiz de 16px, 1rem = 16px. em se compõe quando aninhado (1.5em dentro de 1.5em = 2.25× o tamanho da raiz); rem não.
Quando devo usar cada unidade CSS?
Use rem para tamanhos de fonte (dimensiona com as preferências do usuário). Use em para espaçamento interno do componente que deve dimensionar com o texto do componente. Use px para bordas, sombras e elementos de tamanho fixo. Use % para larguras e layouts. Use vw/vh para dimensionamento relativo à viewport.
Qual é o tamanho de fonte base padrão?
Os navegadores padronizam 16px para o tamanho da fonte raiz. Os usuários podem alterar isso nas configurações do navegador para acessibilidade. Por isso 1rem = 16px por padrão, e por que usar unidades rem respeita as preferências do usuário enquanto px não.
Como as unidades CSS afetam o design responsivo?
Unidades rem e em dimensionam com as configurações de tamanho de fonte, tornando-as responsivas. A função CSS clamp() combina valores mín, preferido e máx: font-size: clamp(1rem, 2.5vw, 2rem). As consultas de mídia podem ajustar o tamanho da fonte raiz e todos os valores baseados em rem dimensionam proporcionalmente.
Como as unidades CSS afetam a acessibilidade?
Os usuários que aumentam o tamanho da fonte padrão do navegador esperam que o texto dimensione adequadamente. Tamanhos de fonte baseados em px ignoram essa preferência. Tamanhos baseados em rem a respeitam. O Critério de Sucesso 1.4.4 do WCAG 2.1 exige que o texto seja redimensionável até 200% sem perda de conteúdo. Usar rem para tamanhos de fonte ajuda a atender a esse requisito.