DevToolPal
한국어

CSS 단위

px → em 변환기

픽셀(px)을(를) em(em)(으)로 변환합니다. 1 px = 0.0625 em, 1 em = 16 px입니다.

공식

em = px ÷ 16

변환 방법

픽셀을(를) em(으)로 변환하려면 값을 16(으)로 나눕니다. 예: 32 px = 2 em.

변환표

px em
1 px 0.0625 em
2 px 0.125 em
4 px 0.25 em
8 px 0.5 em
10 px 0.625 em
12 px 0.75 em
14 px 0.875 em
16 px 1 em
18 px 1.125 em
20 px 1.25 em
24 px 1.5 em
32 px 2 em
48 px 3 em
64 px 4 em

변환표는 기준 글꼴 크기 16px 기준입니다. 위 변환기에서 프로젝트에 맞게 설정을 바꿀 수 있습니다.

이 단위에 대해

브라우저는 모든 CSS 길이를 결국 픽셀로 바꿉니다. rem은 루트 글꼴 크기, em은 부모 요소의 글꼴 크기를 기준으로 하며, 페이지나 사용자가 바꾸지 않으면 주요 브라우저에서 둘 다 16px입니다. 1pt는 1/72인치, 1px는 1/96인치이므로 1pt = 1.333px입니다. vw는 뷰포트 너비의 1%라서 픽셀 값은 화면에 따라 달라집니다.

자주 묻는 질문

› px을(를) em(으)로 어떻게 변환하나요?

1 px = 0.0625 em입니다. 변환하려면 값을 16(으)로 나눕니다: 32 px = 2 em.

› 1 em은(는) 몇 px인가요?

1 em = 16 px입니다. 반대 방향 공식은 px = em × 16입니다.

› px 대신 rem을 쓰는 이유는?

rem은 사용자가 브라우저에서 설정한 글꼴 크기를 따라가 접근성에 좋고, 루트 값 하나만 바꿔도 전체 레이아웃이 일관되게 조정됩니다.

› rem과 em의 차이는?

rem은 항상 루트(html) 글꼴 크기를 씁니다. em은 부모 요소의 글꼴 크기를 쓰므로 중첩하면 값이 곱해집니다.