픽셀 변환기 사용법 (단계별 워크스루)

Screen Ruler TeamApril 28, 202616 min read
how to use pixel converterpixels to mmpixels to inchesDPI conversion

픽셀을 물리 단위로 변환하는 데 차트, 계산기, "96 px가 몇 mm지" 검색은 필요 없어요. Screen Ruler Online의 무료 픽셀 변환기가 수학을 즉시 처리해요 — 단, 어떤 DPI를 골라야 할지 알아야 해요. 이 가이드는 전체 워크플로를 짚어 줘요: 값 붙여 넣기, 상황에 맞는 DPI 고르기, 다른 쪽에서 올바른 단위 읽기. 끝날 즈음엔 변환을 세 가지 다른 상황에 세 가지 다른 방식으로 해 본 셈이 돼요: 웹 디자인, 인쇄 준비, 사진 인화.

30초 버전

급하다면 단계는:

  1. screenruler.online/pixel-converter를 여세요.
  2. 입력 필드에 값을 타이핑하거나 붙여 넣으세요.
  3. 값에 맞는 단위 칩(px / mm / cm / inch)을 클릭하세요.
  4. DPI 프리셋을 고르세요 — 웹엔 96, 인쇄엔 300, 사진엔 600.
  5. 결과 패널에서 변환된 값을 읽으세요. 어떤 단위 옆의 복사 버튼을 누르면 클립보드에 들어가요.

이게 전부예요. 가이드의 나머지는 왜 300 대신 96을 골랐는지 이유를 알아야 할 때, 결과가 디자인 도구가 보고하는 것과 다를 때, 변환이 반대 방향으로 갈 때를 위한 거예요.

1단계: 변환기 열기

https://screenruler.online/ko/pixel-converter로 가세요. 페이지는 즉시 로드돼요 — 계정도, 가입도 없고, 변환기는 서버에서 렌더링되므로 느린 연결에서도 수학이 작동해요. 즐겨찾기에 넣어 두세요; 다시 올 거예요.

페이지엔 세 영역이 있어요: 왼쪽 상단의 값 입력, 오른쪽 상단의 DPI 셀렉터, 그 아래에 네 단위(픽셀, 밀리미터, 센티미터, 인치)를 한 번에 보여 주는 결과 패널. 페이지가 로드되자마자 기본 상태는 96 DPI에서 100 px이고, 이미 ~26.46 mm / ~2.65 cm / ~1.04 인치를 보여 줘요. 그러니 아무것도 타이핑하기 전에 페이지가 작동하는지 확인할 수 있어요.

2단계: 값 입력

"변환할 값"이라고 표시된 입력 필드를 클릭하고 숫자를 타이핑하거나 붙여 넣어요. 변환기가 받는 형태:

  • 순수 정수: 100
  • 소수: 42.5, 0.75
  • 천 단위 구분자가 있는 숫자: 1,920은 1920으로 해석돼요
  • 주변 공백: 100 작동해요
  • 0: 유효한 입력 — 모든 단위에서 0을 줘요

음수(길이는 음수일 수 없음)나 숫자가 아닌 문자열은 받지 않아요. 입력이 유효하지 않으면 결과 패널은 오래된 숫자 대신 "변환을 보려면 음이 아닌 숫자를 입력하세요."를 보여 줘요 — 그래서 오해 소지가 있는 값을 실수로 복사할 일이 없어요.

3단계: 소스 단위 고르기

입력 필드 아래엔 네 가지 단위 칩이 있어요: 픽셀 / 밀리미터 / 센티미터 / 인치. 방금 타이핑한 숫자에 맞는 걸 클릭하세요. 변환기는 활성 칩을 파란색으로 강조하고 입력을 그 단위로 다루며, 결과 패널의 나머지 세 행이 변환이 돼요.

흔한 패턴:

  • 디자인 도구에서(Figma, Photoshop, Sketch, Adobe XD): 거의 항상 픽셀이니 픽셀을 선택된 채로 두세요.
  • 인쇄소의 스펙이나 PDF에서: 보통 밀리미터나 인치. 매칭되는 칩을 클릭하세요.
  • CSS 규칙에서(width: 1024px): 픽셀.
  • 인쇄 목업에서("100 mm × 50 mm 로고"): 한 번에 한 차원씩 밀리미터를 고르세요.

4단계: 올바른 DPI 고르기

이게 사람들이 걸려 넘어지는 단계예요. 변환기는 기본값으로 96 DPI를 써요 — 브라우저와 운영체제가 표준화한 CSS 참조 해상도예요. 웹 작업엔 맞지만 인쇄나 사진엔 아니에요. DPI 드롭다운은 다섯 가지 프리셋을 줘요:

프리셋 DPI 언제 사용
웹 표준 96 CSS, 브라우저, OS 참조
Mac 레거시 72 초기 Apple 타이포그래피(오늘날 거의 안 씀)
인쇄 초안 150 포스터, 배너, 대형 포맷 교정
인쇄 고품질 300 잡지, 책, 패키지 — 가장 흔한 인쇄 DPI
사진 인화 600 파인 아트 인화, 선화, 확대해서 보는 글자

비표준 하드웨어(220 PPI iPad, 300 DPI 프루퍼, 1200 DPI 산업용 프린트헤드)에 유용한 사용자 지정 옵션도 있어서 어떤 DPI든 입력할 수 있어요.

간단한 경험칙: 화면에 표시될 거면 96, 인쇄될 거면 300, 가까이서 보는 사진 인화면 600.

5단계: 결과 읽기

아래 결과 패널은 네 단위를 한 번에 보여 줘요. 입력으로 선택한 단위가 강조돼요(자신의 숫자를 변환된 것처럼 잘못 읽지 않도록). 각 행은 적절한 정밀도로 포맷된 값을 보여 줘요:

  • 픽셀: 정수(브라우저 픽셀은 이산)
  • 밀리미터: 소수점 2자리(26.46)
  • 센티미터: 소수점 3자리(2.646)
  • 인치: 소수점 4자리(1.0417 — 타이포그래피는 1/1000 인치를 써요)

어떤 단위 옆의 복사를 클릭하면 <값> <단위>가 클립보드에 들어가요. 버튼은 잠깐 "복사됨!"을 보여 주니 들어간 게 확실해요.

6단계: 공유 또는 즐겨찾기

변환기는 현재 상태를 쿼리 파라미터로 URL에 반영해요: ?value=100&from=px&dpi=96. 이건 다음을 할 수 있다는 뜻이에요:

  • URL을 동료와 공유해서 같은 변환을 보게 하기.
  • 특정 설정을 즐겨찾기 — 예: 반복되는 인쇄 스펙 점검에 "300 DPI에서 300 mm".
  • 숫자를 잃지 않고 새로 고침.

URL은 타이핑하는 동안 업데이트되니 기억할 저장 버튼이 없어요.

풀이 예시 1: 웹 배너 사이징

"1920 × 720 px"로 히어로 이미지를 디자인하라는 요청을 받았는데 마케팅 팀이 이게 일반 데스크톱 모니터에서 얼마나 큰지 알고 싶어 해요.

  1. 입력에 1920을 타이핑하세요.
  2. 픽셀 칩이 이미 선택돼 있어요(기본).
  3. DPI는 이미 96(웹)이에요.
  4. 밀리미터 행을 읽으세요: 508.00 mm — 약 50 cm 너비.
  5. 입력을 720으로 리셋해 높이를 얻으세요: 190.50 mm — 약 19 cm 높이.

그러니까 배너는 표준 1080p 모니터에서 물리적으로 약 50 × 19 cm를 차지해요. 200% 스케일링의 4K 디스플레이에선 같은 CSS 차원이 여전히 그 물리 영역을 덮어요; 100%의 4K 디스플레이에선 절반 크기가 돼요 — 그래서 CSS가 물리 픽셀 밀도와 무관하게 96 참조 픽셀을 쓰는 거예요.

풀이 예시 2: 정확한 크기의 인쇄 로고

인쇄소가 "300 DPI 브로셔에 정확히 50 mm 너비로 인쇄되는" 로고를 납품하라고 요청해요. 얼마나 많은 픽셀의 소스 디테일을 제공해야 할지 알아야 해요.

  1. 입력에 50을 타이핑하세요.
  2. 밀리미터 칩을 클릭하세요.
  3. DPI를 **인쇄 고품질 (300)**으로 전환하세요.
  4. 픽셀 행을 읽으세요: 591 픽셀.

그러니까 소스 아트워크는 최소 591 픽셀 너비여야 해요. 600 px로 익스포트하면 크롭에 1.5% 여유가 있고 305 DPI에서 선명하게 인쇄돼요. 400 px로 익스포트하면 인쇄소는 200 DPI에서 591 유효 픽셀로 업스케일링해요 — 광택지에 눈에 띄게 부드럽게 나와요.

변환기는 양방향이에요: 원하는 픽셀 수에서 시작해서 매체에 맞춰 DPI를 전환하고 해당 물리 크기를 읽을 수도 있어요.

풀이 예시 3: 카메라에서 온 사진 인화

24 메가픽셀 카메라로 6000 × 4000 픽셀로 사진을 찍었어요. 광택 사진 용지에 300 DPI로 인쇄하고 싶어요. 인화는 얼마나 크게 할 수 있을까요?

  1. 입력에 6000을 타이핑하세요.
  2. 픽셀 칩 선택.
  3. DPI = 300.
  4. 인치를 읽으세요: 20.0000 인치 — 그리고 센티미터: 50.800 cm.

그러니까 긴 변은 네이티브 해상도에서 정확히 50.8 cm로 인쇄돼요. 더 크게 가려면 업샘플링이 필요해요: 300 DPI의 70 cm는 8268 픽셀이 필요한데 6000밖에 없어요. 더 부드러운 인화(약 215 유효 DPI)를 받아들이거나 인화를 ~63 cm로 내려서 네이티브로 유지할 수 있어요.

반대 방향: 차원에서 픽셀로

대부분의 경우 픽셀에서 시작해 물리 단위로 변환해요. 하지만 반대로도 똑같이 잘 작동해요:

  • 인쇄 스펙: "300 DPI에서 100 × 100 mm 아이콘 필요." → 300 DPI에서 100 mm 타이핑 → 각 변 1181 픽셀.
  • 배너 광고: "A4 PDF 리더용으로 96 DPI에서 210 mm 너비." → 794 픽셀.
  • 디스플레이 패널: "11.6인치 디스플레이가 1080p — DPI는?" → DPI를 풀어요: 1920 px / 11.6 인치 ≈ 165 DPI. 사용자 지정 DPI = 165로 전환하세요.

세 번째 케이스에 대해 변환기는 "DPI 계산" 모드가 없지만 후보 DPI에서 11.6 인치를 타이핑하고 픽셀이 매치되는지 확인해서 검증할 수 있어요.

흔한 실수

인쇄용 DPI 전환을 잊는 것. "300 DPI에서 100 mm 로고"는 1181 픽셀을 줘요. 잊고 기본값 96 DPI를 쓰면 변환기는 378 픽셀이라고 해요 — 그리고 인쇄소는 파일이 너무 작다고 말할 거예요. 인쇄 숫자를 읽기 전에 항상 DPI 드롭다운을 확인하세요.

파일에 저장된 DPI 태그를 신뢰하는 것. Photoshop의 "Save for Web"은 파일 메타데이터를 72 DPI로 설정해요. 브라우저는 무시해요. 인쇄 프레스는 레이아웃 도구가 알려 주는 걸 쓰지 파일 태그를 쓰지 않아요. 변환기도 무시해요 — 매번 어떤 DPI를 쓸지 물어봐요.

Retina에서 CSS 픽셀과 디바이스 픽셀을 섞는 것. Retina 화면을 물리 자로 재고 DPI를 역산하려 하면 iPhone에서 ~163 PPI가 나와요. CSS는 여전히 96을 써요. 둘 다 맞아요; 다른 것을 묘사해요. 변환기는 CSS 픽셀을 말해요. 특정 화면에서의 물리 픽셀 측정에는 Screen Ruler 도구로 보정하세요.

입력 행 강조를 무시하는 것. 픽셀 행이 강조될 때 그 행의 값은 입력이지 변환이 아니에요. 다른 세 행을 읽으세요. (생각보다 많은 디자이너가 이 함정에 걸려요.)

다음 단계

변환기가 워크플로의 일부가 되면 관련된 두 도구가 따라오는 경향이 있어요:

  • 화면 비율 계산기는 직교 문제를 다뤄요: "1920 × 1080이 3840 × 2160과 같은 모양인가?" 다른 매체용 자산을 재구축하고 차원과 모양 모두가 중요할 때 픽셀 변환기와 함께 쓰세요.
  • Screen Ruler는 실세계 보정을 다뤄요: 화면에 1:1 자를 보여 줘서 CSS 측정을 물리 객체(신용카드, 인쇄물, 동전)와 비교할 수 있어요. 특정 디스플레이에서 DPI 불일치를 의심할 때 그게 확인해 주는 도구예요.

셋 다 즐겨찾기하면 픽셀-물리 단위 워크플로 전체가 탭 하나 거리예요.

관련 글

관련 글