px, rem, em, %, vw, vh 등 CSS 단위 간에 즉시 변환합니다.
결과
1rem
16px 환산
일반 변환 (기준 16px)
The IT Hustle의 무료 CSS Unit Converter로 px, rem, em, %, vw, vh 등 CSS 단위를 자유롭게 변환하세요.
글꼴 크기와 여백에는 사용자의 접근성 설정을 존중하기 위해 rem을 사용하세요. 테두리나 그림자, 서브픽셀 렌더링이 필요 없는 아주 작은 값에는 px가 적합합니다. 핵심은 rem이 브라우저의 글꼴 크기 설정에 따라 자동으로 스케일된다는 점입니다.
html { font-size: 62.5% }로 설정하면 1rem이 기본값 16px 대신 10px이 되어 계산이 편해집니다. 예: 1.6rem = 16px, 2rem = 20px. 다만 서드파티 컴포넌트에 영향을 줄 수 있어 논란의 여지가 있습니다.
rem은 루트 요소의 글꼴 크기(보통 16px)를 기준으로 합니다. em은 부모 요소의 글꼴 크기를 기준으로 하기 때문에, 중첩 요소에서 값이 누적되어 예측하기 어려울 수 있습니다. 일관성을 위해 일반적으로 rem이 권장됩니다.