px ↔ rem 변환기

사용 예시

• CSS 크기 변환 - 24px을 16px 기준 1.5rem으로 변환합니다.
• 디자인 토큰 정리 - 디자인 시안의 px 값을 rem 기반 스타일로 바꿉니다.

계산·사용 가이드

px와 rem 변환 공식

rem은 HTML 루트 요소의 font-size 기준입니다. 기본값이 16px이면 1rem=16px, 2rem=32px입니다. 기준 폰트 크기를 바꾸면 변환 결과도 달라집니다.

반응형 디자인 활용

px는 화면 크기에 관계없이 절대 크기이고, rem은 사용자 브라우저 폰트 설정에 맞게 스케일됩니다. 접근성을 고려할 때 rem 단위 사용을 권장합니다.

자주 묻는 질문

기준 폰트 크기를 바꿀 수 있나요?

네, 기본 16px 외에 프로젝트 기준값을 직접 입력할 수 있습니다.

소수점 rem도 계산되나요?

네, 최대 6자리까지 정리해 표시합니다.

관련 도구

• CSS vw 단위 변환기 - px 값을 viewport 너비 기준 vw 단위로 변환하거나 그 반대로 변환합니다.
• CSS clamp 생성기 - 최솟값·최댓값과 뷰포트 범위를 입력해 CSS clamp() 함수를 자동으로 생성합니다.
• CSS 포매터 - CSS 코드를 규칙과 속성 단위로 보기 좋게 정렬합니다.
• Flexbox 생성기 - flex-direction, justify-content, align-items, gap 값을 조정해 Flexbox CSS를 생성합니다.
• URL 인코딩/디코딩 - 텍스트를 URL 안전 형식(%XX)으로 인코딩하거나 인코딩된 URL을 원래 텍스트로 디코딩합니다.
• Base64 변환기 - 텍스트를 Base64로 인코딩하거나 Base64 문자열을 원래 텍스트로 디코딩합니다.