在 Mac 上製作 Open Graph 和社群預覽圖
製作 1200 × 630 的卡片，在 X、LinkedIn、Slack、WhatsApp 和 iMessage 上分享連結時顯示。
在 Mac 上使用「OG 影像產生器」
App 的截圖，使用範例檔案。
如何使用「OG 影像產生器」
- 1
輸入你的標題
這是唯一必填的項目。你也可以在標題上方加入副標題和簡短標籤。不需要任何檔案。
- 2
挑選風格
選擇顏色範本或你自己的兩種顏色、漸層方向和字體；如果想要質感，可以加上淡格線或底片顆粒。
- 3
也可以加入影像
拖入標誌、產品照或背景照片，並選擇第一張影像的用途。
- 4
按一下「製作卡片」
1200 × 630 的卡片會儲存在「下載項目 › OneMacTools」中的日期資料夾內，要貼上的 meta 標籤則會顯示在 App 中。
- 5
加到你的網頁
將圖片上傳到你的網站，再把標籤貼到網頁的 <head> 中，並換成圖片的實際網址。
「OG 影像產生器」的功能
輸入標題，可選擇加上標籤和副標題，挑選一種風格或自訂顏色、漸層方向和字體，也可加上格線或底片顆粒。可加入標誌、以卡片形式浮在右側的產品照，或背景照片。過長的標題會自動縮小。你還會得到可貼進網頁的 meta 標籤。
適合用於
- 為部落格文章加上合適的分享圖片
- 宣布產品上市
- 讓連結預覽看起來更專業
選項說明
- 標題
- 必填。主標題。過長的標題會自動縮小並換成多行。
- 副標題（選填）
- 標題下方較小的一行文字，例如一句話的描述。
- 標題上方的標籤（選填）
- 標題上方的一小段大寫標籤，例如 NEW 或 GUIDE，以範本的強調色顯示。
- 風格
- 午夜、海洋、夕陽、森林、葡萄、紙張、企業或自訂顏色。每個範本都會設定背景、文字和強調色。
- 顏色（兩個十六進位值）
- 僅在「風格」為「自訂顏色」時顯示。兩個十六進位值，例如 #0F172A, #2563EB，分別為漸層的起點和終點。文字會依第一個顏色自動變深或變淺。
- 漸層
- 對角、左到右、上到下或純色。「純色」只使用第一個顏色。
- 字體
- 無襯線、襯線、圓體或等寬，都是 Mac 系統字體的不同版本。
- 如果加入影像，用作
- 標誌（左上角）、產品照（右側卡片）或背景照片。套用於你拖入的第一張影像。背景照片會調暗，讓白色文字保持清晰。第二張影像一律作為產品照。
- 淡格線
- 預設關閉。在背景上加一層淡淡的格線。
- 底片顆粒
- 預設關閉。加上細緻的顆粒，營造柔和的印刷質感。
- 儲存為
- PNG 或 JPEG。PNG 能讓文字和純色保持清晰；使用背景照片時，JPEG 檔案較小。
最佳做法
- 標題盡量簡短，大約 6 到 10 個字。預覽通常顯示得很小，字數越少，文字就能越大越清楚。
- 關鍵文字不要太靠近邊緣。有些 App 會稍微裁切預覽圖。
- 請使用透明背景的標誌，讓它乾淨地疊在漸層上。
- 每個頁面或貼文各製作一張風格一致的卡片，讓分享的連結看起來成套。
- 發布後，請用偵錯工具測試連結，或貼到聊天中看看，因為 App 會快取預覽。
搭配使用
- 輸入
- 不需要任何檔案。可選擇加入標誌、產品照或背景照片（最多兩張影像）。
- 輸出
- 一張 1200 × 630 的 PNG 或 JPEG，以「og-」加上你的標題命名，另附 App 中顯示的 og:image 和 Twitter Card meta 標籤。
- meta 標籤使用的是預留網址；請替換成你上傳影像的位置。
關於「OG 影像產生器」的問題
Open Graph 圖片該是什麼尺寸？
1200 × 630 像素是連結預覽最常用的尺寸，也就是 OG 影像產生器製作的尺寸。
不用設計軟體如何製作連結預覽圖片？
開啟「OG 影像產生器」，輸入標題，挑選風格後按一下「製作卡片」。不需要加入任何檔案。
如何把 OG 影像加到我的網站？
將圖片上傳到你的網站，然後把 App 中顯示的 meta 標籤貼到網頁的 <head> 中，並將範例網址換成圖片的實際網址。
可以使用我自己的品牌色嗎？
可以。選擇「自訂顏色」並輸入兩個十六進位值。文字顏色會自動在深色和淺色之間切換以搭配。
可以在卡片上放我的標誌或截圖嗎？
可以。拖入後選擇「標誌（左上）」或「產品圖（右側卡片）」。再加入第二張圖片，就能同時放上標誌和產品圖。
為什麼分享連結時沒有顯示新圖片？
App 會快取連結預覽。請確認標籤位於網頁的 <head> 中且影像網址有效，然後使用平台的預覽或偵錯工具重新整理。
「OG 影像產生器」會上傳我的檔案嗎？
不會。「OG 影像產生器」完全在你的 Mac 上執行，檔案絕不會離開你的 Mac，也能離線使用。
「OG 影像產生器」會更改我的原始檔案嗎？
不會。結果會另存為新檔案，放在「下載項目 › OneMacTools」中以日期命名的資料夾；除非你開啟了另有說明的選項，否則原始檔案會完全保持原樣。
「OG 影像產生器」需要什麼？
只需要一台搭載 macOS 26 或以上版本的 Mac。不需另外安裝任何東西。
接下來這樣做
網站需要的所有 Favicon，加上 Web Manifest 和可直接貼到網頁中的 HTML。
壓縮 PNG透過減少顏色將 PNG 縮小 60–80%，並保留透明度 — 非常適合截圖、標誌和圖示。
