跳至主要內容
Lizely

placeholder 圖形生成器

立即在瀏覽器中以你選擇的顏色和標籤建立自訂大小的 PNG 佔點陣圖。

隱私權：你的檔案不會離開裝置，所有處理均在瀏覽器本機完成。

使用方式

  1. 1.請輸入精確的輸出寬度與高度，單位為整數像素。
  2. 2.選擇背景與文字顏色，然後可選地更換預設的尺寸標籤。
  3. 3.點選「建立 placeholder」，確認報告的尺寸，並下載 PNG。

關於placeholder 圖形生成器

placeholder 圖形產生器會為空的佈局區塊、線框圖、原型、裝置或內容模擬圖產生真實可下載的 PNG。輸入所需的寬度與高度，選擇背景與文字顏色，可選地輸入短標籤，然後產生圖片。若標籤空白，圖片將自動顯示其尺寸，例如 1200 × 630。所有內容皆在瀏覽器中繪製並編碼，因此不會傳送任何專案名稱、草稿內容或產生圖片至伺服器。

寬度與高度以整數像素為單位，範圍為 1 至 10,000，每邊，總計不得超過 40 百萬像素的畫布預算。此限制可支援常見的社交媒體預覽、網站、簡報與高解析度模擬圖尺寸，同時避免意外輸入導致不安全的畫布分配。下載的檔案將精確使用驗證後的寬度與高度。預覽可能視覺上縮放以適應頁面，但該顯示尺寸不會改變 PNG 的自然解析度。

預設標籤僅在驗證後由輸出尺寸計算得出。自訂標籤將被截斷，限制為 80 Unicode 個字元，水平與垂直居中，並以瀏覽器系統的無襯線字型顯示。字型大小根據較短的圖片尺寸自動調整，最小為 12 像素，最大為 96 像素。若自訂標籤仍過寬，將在渲染時以省略號縮短，避免溢位畫布。

顏色使用六位十六進位值，透過瀏覽器原生顏色控制元件選擇。背景先繪製整個畫布，接著以選定的前景顏色繪製標籤。該工具不會自動調整對比度、加入漸層、引入透明度或修改提供的顏色。這讓它適用於設計令牌（如 #e5e7eb）的確定性情境，但也意味使用者應選擇可讀的前景與背景組合。

輸出為名為 placeholder-WIDTHxHEIGHT.png 的 PNG。選擇 PNG 是因為它廣泛支援、能清晰渲染文字與平塗色，且提供穩定的檔案格式，不受瀏覽器 JPEG 品質行為影響。結果列會顯示精確的尺寸、實際渲染的標籤與約估的檔案大小。當輸入變更時，下載的物件 URL 會被取代並作廢，避免舊的預覽被誤認為當前設定。

此生成器在需要本機資源優於第三方 placeholder URL 時非常實用。本機 PNG 可讓原型在離線環境中運作，避免將頁面瀏覽行為洩露至圖片伺服器，且不會因外部 placeholder 服務調整回應內容而改變。它也可用於建立穩定的截圖測試固定物件，當已知尺寸與簡單背景比裝飾性相簿更為實用時。

該工具刻意不抓取遠端圖片、加入庫存照片、產生 AI 藝術作品、產生響應式 srcset 變體、選擇平臺特定推薦尺寸，或聲稱某特定尺寸符合社交平臺需求。它僅會產生你請求的精確像素。對於生產級攝影、品牌設計、向量檔案或符合可及性需求的文字組合，請使用合適的設計流程，並在最終圖片發布時提供具意義的頁面級替代文字。

方法與來源

解析限制在整數像素的寬度與高度，強制遵守 40 百萬像素的畫布預算，標準化六位十六進位顏色，當自訂文字空白時選擇尺寸標籤，限制標籤長度與字型大小，於自然尺寸的畫布上繪製背景與居中文字，編碼 PNG，並在輸入變更時作廢過期的輸出網址。

常見問題

若不填標籤，會顯示什麼文字？
工具會將驗證後的寬度與高度居中顯示，例如 1200 × 630。
預覽會改變下載的解析度嗎？
不會。預覽僅為頁面視覺縮放，下載的 PNG 會保留你輸入的精確寬度與高度。
我的尺寸、顏色或標籤會上傳嗎？
不會。畫布繪製、PNG 編碼、預覽與下載生成皆在你的瀏覽器中執行。
該工具會選擇社交媒體推薦尺寸嗎？
不會。它避免使用時間敏感的平臺預設設定，僅會依照你請求的尺寸生成。

相關工具

圖片工具 使用指南

查看全部