dev.syw
프론트엔드

px vs rem

px는 고정 크기, rem은 루트 글꼴 크기에 비례하는 상대 단위입니다.

CSS의 두 길이 단위입니다. 사용자 설정·접근성 대응에서 차이가 납니다.

구분pxrem
기준절대값(픽셀)루트(html) font-size 배수
접근성사용자 글꼴 설정 무시설정에 따라 확대
예측성직관적계산 필요(1rem=16px 기본)

px를 쓸 때

테두리 두께처럼 항상 고정돼야 하는 값에 사용합니다.

rem를 쓸 때

글자 크기·여백처럼 접근성과 반응형이 중요한 값에 사용합니다.

결론

폰트·여백은 rem, 미세한 고정값은 px가 무난합니다. 접근성을 위해 글꼴 크기에는 rem을 권장합니다.

← 개발 개념 비교 전체 보기