Sketch 使用以點（顯示點）為單位的 macOS 座標系統。在 Sketch 中工作時，所有內容（包括文字圖層）皆以點為單位。
什麼是點（顯示點）？
隨著 2010 年 Retina 顯示器的推出，Apple 將 x 軸和 y 軸上的所有像素減半。現在一個像素等於四個實體像素，而螢幕尺寸保持不變。這使解析度提高了兩倍，通常寫成 @2x。
解析度的提高改善了文字的可讀性，但也意味著螢幕上的物件需要以兩倍的像素大小顯示，才能呈現相同的大小。所選擇的解決方案是將像素從硬體中抽象出來，一個像素不再是螢幕上的一個像素。為了清楚起見，這些像素就是點。
@1x 和 @2x 解析度的圖示。左側是一個正方形代表一個像素，標記為 1pt = 1px。右側是相同的正方形，分成四個大小相等的較小正方形。標記為 1pt = 2px。
顯示器會依解析度類別排序；這表示它們的解析度相對於 2010 年之前常見的解析度 (72 ppi) 的縮放比例。
這些類別是 @1x（無縮放）、@2x（像素加倍）、@3x（像素三倍）等等。Apple 裝置一律為 @2x 或更高，其中 iPhone 13 使用 @3x 顯示器。Sketch 會自動以 Mac 上顯示器使用的解析度來渲染畫布。
這對我的設計有什麼影響？
Sketch 中的一個點在 @1x 顯示器上轉換為一個實際像素，但在 @2x 顯示器上則是指四個實際像素。由於所有內容都會根據您的顯示器進行縮放，包括 macOS 和 Sketch 本身，因此您在設計時無需注意這一點，一切看起來都會更好。
匯出圖層時，您可以設定 Sketch 匯出畫板的比例。如果您以 @2x 匯出素材或畫板，則一個點將等於四個實際像素，因為 Sketch 會沿著 x 軸和 y 軸將其加倍。匯出 @3x 將等於九個像素（3x3 個實際像素），依此類推。
所有這些都是在 Sketch 中顯示的尺寸保持不變的情況下發生的。iPhone 螢幕尺寸就是一個很好的例子。iPhone 13 的尺寸為 390 x 844 點，解析度為 1170 x 2532 像素，它具有 @3x 顯示器。
在 Retina 顯示器上設計 @1x 顯示器
Sketch 會以您顯示器的像素密度來渲染畫布。在配備非 Retina 像素密度（小於 @2x）的現代 Mac 上設計顯示器時，您會看到比使用者更多的細節。建議您開啟 檢視 > 畫布 > 放大時顯示像素。當您縮放到 100% 以外的任何比例時，Sketch 會以其實際的 @1x 解析度來渲染您的設計。如果您知道目標硬體的實際尺寸，請在 Sketch 中設定縮放級別，以便 Mac 顯示器上的畫板與目標硬體具有相同的尺寸，這不太可能是 100%。
點數和 CSS
如果您從 Mac 或我們的網頁應用程式複製 CSS 屬性，它們將以 px（CSS 像素）為單位，其工作方式與 macOS 上的點數相同。Sketch 中 3pt 边框等屬性將在 CSS 中匯出為 3px 边框。CSS 中的 1px 等於 Sketch 和 macOS 中的 1pt（點）。
您可以在 W3C 網站上的文章 CSS：em、px、pt、cm、in… 中瞭解更多關於 CSS 像素的資訊。
