像素轉換器

在任何 DPI 下將像素即時轉換為毫米、厘米和吋——直接在瀏覽器中完成。

來源單位

96 DPI·96 DPI — CSS、瀏覽器、作業系統參考

轉換結果

  • 100像素
  • 26.46毫米
  • 2.646厘米
  • 1.0417

螢幕間尺

立即使用間尺

甚麼是像素轉換器?

像素轉換器可在你選定的 DPI 下,將數位像素與真實長度單位(毫米、厘米、吋)互相換算。CSS 像素預設以 96 DPI 計算,但列印工作會用 300 DPI,相片列印甚至可達 600 DPI——在不同的 DPI 數值下,相同的像素數會對應到差異甚大的實體尺寸。在四個單位的任一格輸入數值,選擇符合你情境的 DPI 預設,其餘三個單位便會即時更新。每個結果只需一鍵即可複製到剪貼簿。

如何使用像素轉換器

  1. 在輸入欄輸入你想轉換的數值——例如 100。
  2. 選擇你輸入的單位:像素、毫米、厘米或吋。
  3. 選擇 DPI 預設值——網頁用 96 DPI、列印用 300 DPI,或選擇「自訂」輸入自己的 DPI。
  4. 在下方結果面板閱讀其餘三個單位的轉換數值。
  5. 點擊任一結果旁的「複製」放入剪貼簿,或分享網址——你的輸入會以查詢參數保留。

誰會用像素轉換器

  • 學生: 處理涉及像素轉毫米的數學和物理功課,以及電腦圖學課程中的螢幕解像度練習。
  • 網頁與 UI 設計師: 在合適的參考 DPI 下,把實體稿件量度(毫米)轉換成 CSS 像素,用來設定圖示、留白與元件尺寸。
  • 印刷設計師: 在送印之前,將 Photoshop 或 Figma 匯出的像素尺寸以 300 DPI 換算為毫米和吋。
  • 攝影師: 由相機輸出計算實體列印尺寸(例如 4000 × 3000 px 在 300 DPI 下可列印為 13.3 × 10 吋)。
  • 開發者: 對照產品或無障礙規格中指定的實體尺寸,驗證 CSS 像素數值是否正確。

為何選用本轉換器

  • 四個單位(像素、毫米、厘米、吋)會在你輸入時即時更新。
  • 五個內建 DPI 預設涵蓋常見情境——網頁 96 DPI、舊版 Mac 72 DPI、列印 150/300/600 DPI。
  • 支援自訂 DPI,適用於非標準顯示器(Retina、高解像度螢幕)和特殊印刷流程。
  • 可分享連結——你的數值、來源單位和 DPI 都會以查詢參數保留。
  • 100% 在瀏覽器運行:無需註冊,結果面板無廣告,運算邏輯開源。

轉換器有多精確?

轉換器使用標準的每吋 25.4 毫米比例與你指定的 DPI,並以 IEEE 754 雙精度浮點計算。結果在浮點誤差範圍內準確(相對誤差 ≤1×10⁻⁶)。唯一可能造成實體誤差的因素是 DPI 數值本身——如果你的螢幕並非真正以假設的 DPI 運行,請先用 Screen Ruler 工具校準。

常見問題

甚麼是像素?
像素是數位顯示器或影像中最小的離散單位。它的實體尺寸並非固定——取決於螢幕的像素密度(DPI)。在 96-DPI 的網頁顯示器上,一個像素剛好是 1/96 吋(約 0.265 毫米);在 300-DPI 的列印上,一個像素則是 1/300 吋(約 0.085 毫米)。
甚麼是 DPI?為何重要?
DPI(每吋點數)是像素與實體長度之間的換算因子。同樣是 100 px,在 96 DPI 下對應 26.46 毫米,但在 300 DPI 下只有 8.47 毫米。換算必須使用目標媒介的 DPI——螢幕、列印或匯出檔——結果才有實體意義。
如何將像素轉換為毫米?
將像素數除以 DPI 得到吋,再乘以 25.4 即得毫米:mm = (px / DPI) × 25.4。例如 100 px 在 96 DPI 下:100/96 × 25.4 ≈ 26.46 毫米。轉換器會即時為你完成這項計算。
網頁應使用 72 還是 96 DPI?
請使用 96 DPI。CSS、瀏覽器和作業系統自 1990 年代起就以每吋 96 個參考像素為標準。72 DPI 是早期 Apple 字體排印的遺產(一像素等於一個字體點),現時只有特定 Mac 時代的素材會用到——現代網頁工作一律以 96 DPI 為準。
列印應使用甚麼 DPI?
高品質的雜誌和書籍列印用 300 DPI;草稿打樣與大幅面作品用 150 DPI;只有相片列印、精細線條藝術或需要放大檢視的文字才用到 600 DPI。一般工作超過 300 DPI 只會增加檔案大小,在多數紙張上都看不出差異。
Retina/HiDPI 螢幕會如何影響換算?
Retina 與其他 HiDPI 顯示器會為每一個 CSS 像素渲染兩到三個實體像素。本轉換器預設以 CSS 像素計算,因此 100 CSS px 在 96 DPI 下對任何 HiDPI 螢幕都是正確的。如果你需要實體像素數,可乘以裝置像素比(瀏覽器中的 window.devicePixelRatio)。
為何我的網頁設計在 4K 顯示器上看起來變細?
多數作業系統會將 4K 顯示器以 150–200% 縮放執行,使 CSS 像素在視覺上接近 1080p 顯示器。如果縮放未啟用,相同的像素數會覆蓋更少的實體吋數,設計就會在實體上顯得較細。請在作業系統設定中調整 DPI 縮放,或改用 rem/百分比單位代替固定 px。

DPI 深入解析 — 一次選對數字

每一次像素到長度的換算只有一個公式:長度 = 像素 ÷ DPI。難點在於選對與輸出媒介相符的 DPI。選錯不會報錯,只會悄悄給出數學上正確、物理上錯誤的結果。下方預設覆蓋 95% 真實工作場景。

Web 工作 — 始終用 96 DPI

1990 年代末,CSS、瀏覽器和作業系統統一為每英吋 96 參考像素,至今未變。所有現代瀏覽器都將 1 CSS 像素視為 1/96 英吋,不論物理顯示器為何。Retina 與 4K 顯示器以更高物理密度渲染,但 OS 會把 CSS 像素縮放回 96 DPI 參考,所以你的數學保持有效。72 DPI 視作歷史遺產 — 僅當你從 OS X 之前的 Mac 拉取素材時才相關。

印刷工作 — 150、300 或 600 DPI

大部分雜誌、書籍和消費級相片印刷用 300 DPI。草圖打樣和大幅面工作可降至 150 DPI,因為觀看距離掩蓋了解析度損失;這能減半檔案大小,一米外仍顯銳利。僅當印刷品會近距離審視時才用 600 DPI — 精細線稿、技術繪圖、光面紙上的小字。超過 600 DPI 幾乎不會帶來可見質量提升,反而浪費磁碟空間。

Retina 與 HiDPI — 在 CSS 像素中工作

Retina 顯示器為每個 CSS 像素渲染兩到三個物理像素,但 OS 把這層隱藏在你的程式碼之外。佈局計算堅持用 CSS 像素 (96 DPI)。若需要實際物理像素數 — 例如交付應在每台裝置上保持清晰的點陣素材 — 執行時乘以 window.devicePixelRatio 並提供 @2x 或 @3x 變體。像素轉換器預設把輸入當作 CSS 像素;只有當你確實量度過某已知顯示器的物理像素密度時才勾選自訂 DPI。

常見轉換模式

某些像素值出現得太頻繁,值得記下來。下表展示 100 px、1000 px 和典型全高清寬度 (1920 px) 在四種最常見 DPI 值下的換算結果。

像素96 DPI(網頁)150 DPI(草圖)300 DPI(印刷)600 DPI(相片)
10026.46 mm16.93 mm8.47 mm4.23 mm
1000264.58 mm169.33 mm84.67 mm42.33 mm
1920508.00 mm325.12 mm162.56 mm81.28 mm

開發者實用提示

先在 DevTools 中驗證

信任換算之前,先在主控台輸入 window.matchMedia('(min-resolution: 96dpi)').matches 確認瀏覽器報告的是 96 參考 DPI。在正確配置的系統上回傳 true。若回傳 false,說明 OS 縮放或縮放層級非預設,換算需要調整。

始終以目標 DPI 匯出

Photoshop、Figma 和大多數設計工具預設按畫布 DPI 匯出。匯出前先把畫布 DPI 設為目標媒介 — 把 96 DPI 畫布按 300 DPI 匯出並不會真正上採樣影像,只是改寫元資料,結果以預期物理尺寸的三分之一印出。

校準螢幕以建立真值基準

若你的工作依賴物理精度 — 把手持物體對著螢幕量度、把圖示尺寸對齊到已知信用卡寬度 — 先開啟 Screen Ruler 工具用真實信用卡校準。你螢幕的實際 DPI 鮮少與規格表一致;校準能把換算錨定到物理現實。