Conversão Simples PX para EM

Selecione o tamanho da fonte do seu "Body"

Conversões 'base tamanho padrão do navegador' de 16px

Pixels EMs Percentual Pontos
6px0.375em37.5%5pt
7px0.438em43.8%5pt
8px0.500em50.0%6pt
9px0.563em56.3%7pt
10px0.625em62.5%8pt
11px0.688em68.8%8pt
12px0.750em75.0%9pt
13px0.813em81.3%10pt
14px0.875em87.5%11pt
15px0.938em93.8%11pt
16px1.000em100.0%12pt
17px1.063em106.3%13pt
18px1.125em112.5%14pt
19px1.188em118.8%14pt
20px1.250em125.0%15pt
21px1.313em131.3%16pt
22px1.375em137.5%17pt
23px1.438em143.8%17pt
24px1.500em150.0%18pt

Faça a conversão aqui

Calculadora personalizada de conversão

1. Digite um tamanho de pixel base

px

2. Converter

PX para EM
px
ou
EM para PX
em
Converter

3. Resultado

O que é um EM?

A Wikipedia explica bem: "Um 'EM' é uma unidade de medida no campo da tipografia, igual ao tamanho da fonte atual". Se o tamanho da fonte estiver em 16 pixels, 1em = 16px

Para mais informações, visite Wikipedia Wikipedia e Mozilla MDN.

Qual é a diferença de tamanho do texto entre PX, EM,%, PT?

Pixels e pontos são medições estáticas, mas comumente usadas em diferentes mídias. Os pixels são usados ​​nas telas porque as telas são medidas em pixels. Embora os pontos possam ser usados ​​na tela, eles são o padrão na impressão, pois são um fator de DPI.

Porcentagem e EMs, por outro lado, são medidas relativas. O tamanho de uma unidade EM ou porcentagem depende do pai. Se o texto do corpo for dimensionado em 12 pixels, o texto definido em 120% ou 1,2 EM no corpo será de 1,2 * 12 ou 14,4 pixels.

Como faço para converter entre PX, EM,% e PT?

Aqui estão as fórmulas usadas

Nota: 16 px é usado como o tamanho do texto do corpo em todas as conversões, porque esse é o padrão do navegador. Você alterará 16px para o tamanho do texto base.

PX para EM
Fórmula: tamanho em pixels / tamanho pai em pixels
Examplo: 12px / 16px = .75em
PX para %
Fórmula: tamanho em pixels / tamanho pai em pixels * 100
Examplo: 12px / 16px * 100 = 75%
PX para PT
Fórmula: tamanho em pixels * (pontos por polegada / pixels por polegada)
Examplo: 16px * (72pt / 96px) = 12pt
EM para PX
Fórmula: tamanho em EMs * tamanho pai em pixels
Examplo: .75em * 16px = 12px
EM to %
Fórmula: tamanho em EMs * 100
Examplo: .75em * 100 = 75%

Por que dimensionar seu texto com EMs em CSS?

'Style Sheets' - As Folhas de Estilo que usam EMs são mais fáceis de manter para o designer e mais acessíveis aos usuários finais.

'Style Sheets' - As Folhas de Estilo ficam mais fáceis de manter, porque todo o texto definido nos EMs é dimensionado para o tamanho da fonte do corpo. Somente o tamanho da fonte de um elemento precisa ser alterado, em vez de alterar individualmente o tamanho da fonte de cada elemento.

A acessibilidade é aumentada para os usuários finais, porque o texto é redimensionado com base em suas preferências, em vez de ser definido estaticamente em pixels. Além disso, os usuários finais podem usar teclas de atalho para dimensionar o texto em todos os navegadores. Muitas pessoas têm dificuldade em ler textos pequenos na tela do computador.

Os seus caminhos são caminhos de delícias, e todas as suas veredas são paz.

"Provérbios 3:17"