顯示測試卡產生器｜製作 1080p、4K 與自訂測試圖

測試卡設定

解析度預設

輸出寬度（px）

輸出高度（px）

匯出格式

測試卡已準備，可調整設定或直接匯出。

背景顏色

測試卡標籤

測試圖層

邊框寬度

網格間距

安全區比例（%）

測試卡預覽與輸出

輸出摘要可匯出

測試卡尺寸1920 × 108016:9 · PNG

總像素數: 2,073,600
估計 RGBA 記憶體: 7.9 MB
啟用圖層: 8
檔案名稱: display-test-card-1920x1080.png

目前圖層

像素邊框
網格
幾何圓形
中心十字線
安全區
標準色條
灰階條
角落標記

預覽使用縮放 Canvas；下載仍依目標像素尺寸或 SVG viewBox 產生。

固定像素與可縮放測試卡的選擇

PNG：用於 1:1 像素檢查

PNG 具有固定寬高，適合在播放端不縮放時檢查裁切、網格、圓形變形與像素映射。

SVG：用於多尺寸與向量輸出

SVG 以同一個 viewBox 保留圖層，可無損縮放；但顯示端縮放後，1px 線條可能被重新取樣，不適合作為嚴格像素證據。

深入了解

產生與使用測試卡

先選擇目標解析度，再組合網格、圓形、中心十字、安全區、色條與灰階。要做 1:1 檢查時下載 PNG，並在播放端關閉縮放、Overscan 與畫面增強；列印或多尺寸使用則選 SVG。

產生方式與尺寸計算

預覽會依可用空間縮放繪製，匯出時才建立目標尺寸。安全區按選定比例套用到寬高，四周平均留邊；圓形依較短邊計算，用來觀察幾何拉伸。

效能與適用邊界

不同瀏覽器不一定能建立相同大小的 Canvas。8K PNG 可能需要約 126.6 MB 的原始 RGBA 記憶體，還不含額外快取。失敗時改用 SVG、降低尺寸或減少圖層。

測試卡該選 PNG 還是 SVG？

像素映射、裁切與單像素檢查請選 PNG；無損縮放、列印或多尺寸重用請選 SVG。SVG 縮放後不再代表來源單一像素。

4K 或 8K 測試卡輸出失敗怎麼辦？

先改用 SVG；輸出 PNG 時移除不需要的圖層、降低網格密度、關閉耗記憶體頁面或降低尺寸。Canvas 上限依瀏覽器和裝置而異。

為什麼圓形在電視上像橢圓？

輸入、播放器或電視可能正在做非等比縮放。確認解析度和畫面模式一致，再關閉拉伸、縮放與 Overscan。

安全區比例應該設多少？

90% 是一般視覺參考；廣播、直播、字幕與平台規格可能需要不同邊界。

隱私、實作與來源

預覽與匯出都在目前瀏覽器本機完成，不上傳設定或產生的檔案，也不呼叫第三方執行介面。

本工具使用原生 HTML、CSS 與 JavaScript 實作，不含第三方執行函式庫。