Dimensions

一句話介紹

Dimensions是一種用於測量網頁螢幕尺寸的瀏覽器擴充功能，它能從滑鼠位置開始，向上、下、左、右探測邊界，從而快速得知各元素之間的像素距離以及連續區域的大小。

工具簡介

Dimensions是由Felix Niklas開發的，主要用於網頁設計師、前端開發人員以及品質測試人員。它是一種輕量級的測量工具，不會產生任何內容，也沒有大型語言模型，因此也不屬於AI產品。

資料庫中的原始記錄所使用的dimensions.ink網域名稱，已經被改為與產品無關的賭博相關內容，因此無法再作為官方入口。目前可靠的入口是瀏覽器的官方商店，以及由mrflix維護的開源倉庫。

核心功能概覽

主要功能

測量網頁元素間距

擴展功能會從滑鼠所在的位置出發，向四個方向尋找顏色或元素的邊界，並顯示相應的距離。它很適用於檢查圖片、輸入框、按鈕、影片、GIF、文字和圖示之間的間距。

測量連續區域

按住Alt鍵可以測量連續區域，適合估算圓形半徑或單色區塊的尺寸。漸變、陰影和紋理會導致像素數量大幅增加，從而可能使邊界過早停止。

設計稿測量

使用者可直接將PNG或JPEG格式的設計稿拖入Chrome瀏覽器中，然後再使用Dimensions工具來進行測量。此時，瀏覽器的縮放比例必須維持在100%，否則螢幕上的像素數值可能會與設計稿本身的像素數值不一致。

快捷鍵

預設情況下，可透過 Alt 加 D 來啟動或關閉此擴充功能，而在測量區域時則可使用 Alt 作為輔助鍵。如果快捷鍵與操作系統或其他擴充功能產生衝突，則可在瀏覽器的擴充功能快捷鍵設定頁面中重新設定。

自動顏色適配

擴展會根據背景調整測量標記的顏色，提升深色和淺色頁面上的可讀性。複雜的背景仍可能讓數值難以辨別，可臨時隱藏干擾元素。

安裝教學

1. 打開Chrome官方擴充程式商店並搜尋完整名稱Dimensions。
2. 確認開發者資訊、版本號3.0.1及螢幕測量功能描述。
3. 檢查隱私披露與所需權限，再點擊添加到瀏覽器。
4. 將擴展固定到工具列，便於沒有快捷鍵時啟動。
5. 打開一個測試網頁，按Alt加D確認測量覆蓋層出現。
6. 完成測量後再次按快捷鍵關閉，避免影響正常瀏覽。

網頁尺寸測量教學

1. 將瀏覽器頁面縮放設定為100%，並確定是否啟用裝置模擬。
2. 啟動Dimensions，把滑鼠放在要測量的空隙或元素邊緣。
3. 讀取指針上下左右顯示的像素距離。
4. 移動到另一位置重複測量，排除陰影或文字造成的誤判。
5. 需要區域尺寸時按住Alt，讓工具識別連續邊界。
6. 把結果與開發者工具的盒模型、CSS值和設備像素比核對。
7. 記錄視口寬度與縮放條件，避免將不同環境的數據混用。

設計稿核對流程

1. 取得未被聊天軟體壓縮的原始PNG或JPEG設計稿。
2. 在瀏覽器中以新標籤頁打開圖片，並保持100%縮放比例。
3. 啟動Dimensions，測量邊距、組件間距和連續色塊。
4. 對紋理、漸變或陰影區域改用人工邊界或開發工具。
5. 把測量值與設計文件標註及網頁實際CSS對比。
6. 發現差異時同時檢查設備像素比、圖片縮放和響應式斷點。

適合哪些用戶

• 網頁設計師：快速檢查視覺稿中的邊距和組件尺寸。
• 前端開發者：核對實現頁面與設計稿的像素差異。
• UI測試人員：重新檢查按鈕、表單、圖示與文字之間的間距。
• 產品經理：在評審頁面時記錄明顯佈局問題。
• 學生和初學者：直觀看到網頁元素之間的尺寸關係。
• 開源開發者：基於MIT代碼研究或改進測量邏輯。

典型使用場景

• 測量導航欄圖標與文字之間的水平間距。
• 檢查卡片內部標題、圖片和按鈕的垂直留白。
• 估算輸入框、按鈕或影片在螢幕上的顯示尺寸。
• 比較桌面和響應式視口中的邊距變化。
• 打開靜態Mockup並提取開發所需的像素參考。
• 識別連續色塊或圓形區域的大致邊界。
• 在視覺回歸測試中快速定位佈局偏移。

產品優勢

• 無需註冊帳號，安裝後即可使用。
• 操作簡單，滑鼠移動即可得到四向距離。
• 支援圖片、按鈕、輸入框、影片、文字和圖示等常見內容。
• 能在瀏覽器中直接測量PNG和JPEG設計稿。
• 安裝包體積小，不需要雲端服務或訂閱。
• Chrome商店隱私披露聲明不收集或使用用戶數據。
• 源代碼公開，採用寬鬆的MIT許可證。
• 3.0系列已遷移Manifest V3，相容現代Chrome。

使用限制與注意事項

• Dimensions不是AI工具，只提供基於像素邊界的屏幕測量。
• 原dimensions.ink域名已變為無關博彩網站，不應訪問或用於下載。
• 圖片和複雜背景會因像素頻繁變化而影響邊界識別。
• 漸變、陰影、抗鋸齒和透明度可能造成數值偏差。
• 瀏覽器縮放不是100%時，測量值可能不等於設計原始尺寸。
• CSS像素、裝置像素和截圖像素並非在所有環境下都能一一對應。
• 它不能替代開發者工具盒模型、響應式檢查與無障礙測試。
• Manifest V3版本要求Chrome 88或更高版本，舊版瀏覽器將不再受到支援。
• 擴展只提供英文介面，沒有核實到官方中文本地化。
• 安裝擴展總會增加瀏覽器的攻擊面，應僅從官方商店取得。

價格與版本

截至2026年8月22日，Dimensions可在Chrome官方商店免費下載安裝，無需訂閱、試用期或付費方案。該專案的原始碼亦可依照MIT許可證免費使用。

瀏覽器與版本支援

隱私與安全

Chrome商店顯示，開發者聲明不會收集或使用使用者資料，也不會出售資料，更不會將資料用於不相關的用途或用於信用評估。擴充功能的運作邏輯是在當前頁面中執行的。

• 只從Chrome官方商店安裝，不使用原失效域名下載文件。
• 安裝前檢查版本、開發者、權限和更新日期。
• 企業設備應透過擴展白名單和策略集中控制。
• 測量內部系統時，仍需評估擴展訪問頁面內容的權限。
• 定期查看商店隱私披露和版本更新說明。
• 不再使用時從瀏覽器移除，而不是只隱藏圖示。

官網域名失效風險

資料庫的原官方網站 dimensions.ink 目前顯示的內容與瀏覽器擴充功能無關，產品名稱及頁面用途也均已改變。該網域名已無法用來說明該擴充功能的特性、價格、隱私保護措施或開發者身份。

用戶應透過 Chrome 官方商店確認安裝，並透過 mrflix 的開源倉庫來查看程式碼與版本資訊。請勿在已失效的網域上輸入帳戶資訊、付款資料，或下載未知的檔案。

API、SDK與開源情況

Dimensions是開源瀏覽器擴充功能，不提供雲端API、開發者密鑰或獨立的SDK。開發者可直接閱讀和修改擴充功能的原始代碼，且在二次散布時必須遵守MIT許可證的規定。

基本資訊

推薦指數

推薦指數為3.8分，滿分5分。Dimensions體積小、操作簡單，適合用於網頁設計和前端開發中的快速像素參考，且其開源特性以及無數據收集的說明都相當透明。

扣分主要是因為它不是AI工具、測量算法容易受到複雜圖片影響，且原官方網站域名已經失效。專業交付仍需配合瀏覽器開發者工具和設計源文件。

常見問題

Dimensions是AI工具嗎？

不是。它透過瀏覽器頁面的像素和邊界來進行螢幕測量，沒有生成式AI、語言模型或機器學習功能。

Dimensions免費嗎？

免費，Chrome商店沒有訂閱或內購。源代碼也採用MIT許可證公開。

需要註冊嗎？

不需要。安裝擴展後可直接在網頁中啟動測量。

怎樣啟動測量？

預設是透過按下 Alt 加 D 來啟動或關閉。若要測量連續區域，可按住 Alt 鍵；若出現快捷鍵衝突的問題，則可以在 Chrome 中進行調整。

為什麼圖片測量不準確？

圖片、漸變和抗鋸齒功能會讓顏色逐個像素地改變，而算法可能會將這些變化視為邊界。此時應結合開發者工具或設計檔案來處理。

支援中文嗎？

商店目前僅列出英文。功能主要透過數值和快捷鍵操作，中文頁面本身仍可測量。

會收集網頁數據嗎？

Chrome商店目前的隱私政策聲明，開發者不會收集或使用使用者資料。使用者仍應在安裝時仔細查看實際的權限設定。

原官網還能使用嗎？

不能作為產品入口。原dimensions.ink已顯示無關博彩內容，安裝應使用Chrome官方商店。

提供API或SDK嗎？

不提供。它是瀏覽器擴充功能，開發者可直接使用MIT開源代碼進行研究或改造。

Dimensions是開源的嗎？

這是開源軟體，其官方儲存庫採用MIT許可證。此開源儲存庫與同名的科研資料庫、Inkscape插件並無關聯。

總結

Dimensions是一種專注於網頁像素距離的輕量級瀏覽器擴充功能，適合用來快速檢查頁面間距與靜態設計稿，但無法取代完整的開發與設計測量工具。

目前最重要的變化是，原有的官方網站網域已經失效。使用者應從官方商店下載安裝，並透過開源倉庫來確認版本、程式碼以及授權條款。