*OGImageTool*免費 OG 圖片生成器

無需註冊,簡單點擊即可免費建立精美 OG 圖片、Twitter/X 頭圖等。

100% 免費
無需註冊
本地處理,隱私優先
無浮水印

效果預覽

看看你能做出什麼樣的 OG 圖

Open Graph template preview 1 - social media image with clean layout
Open Graph template preview 2 - modern gradient background social card
Open Graph template preview 3 - minimalistic text focused preview image
Open Graph template preview 4 - dark mode themed social sharing graphic
Open Graph template preview 5 - elegant typography based social cover

左右滑動查看更多

Twitter X profile header layout preview 1
Twitter X profile header layout preview 2 with gradient
Twitter X profile header layout preview 3 for developers

左右滑動查看更多

現在就試試

Preparing editor...

為什麼選擇 OGImageTool?

你需要的一切功能,都能在幾秒內生成高質量社群圖片

免費且無需註冊

無需註冊、無需信用卡,開啟即用,全部核心功能免費。

多平台適配

自動匹配常見平台尺寸,適合 Open Graph、Twitter/X 頭圖等場景。

專業模板

內建多種專業模板,覆蓋基礎、Hero、右圖、公告、Logo 等版面。

靈活導出

支援 PNG、JPEG、WebP 導出,兼顧品質與體積。

高級定制

可自訂背景、漸層、圖案與品牌色,並支援上傳 Logo 與圖片。

現代視覺

提供現代排版與視覺效果,輕鬆做出高質感封面。

即時預覽

所見即所得,修改後立即看到效果,提升設計效率。

極速生成

幾秒完成社群圖片製作,流程簡潔高效。

如何新增 Open Graph 圖片

在幾分鐘內為你的網站加入社群媒體預覽圖。可選擇 HTML 或 Next.js App Router 方式。

1. 儲存圖片

將生成的 OG 圖片儲存為 og.png 並放在網站根目錄。

2. 添加到 HTML 標頭

<!-- Basic OG Tags -->
<meta property="og:title" content="Your Page Title" />
<meta property="og:description" content="Your page description" />
<meta property="og:image" content="https://yourdomain.com/og.png" />
<meta property="og:url" content="https://yourdomain.com" />

<!-- Twitter/X Card Tags -->
<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:image" content="https://yourdomain.com/og.png" />

<!-- Optional but recommended -->
<meta property="og:type" content="website" />
<meta property="og:site_name" content="Your Site Name" />

請將 yourdomain.com 替換為您的真實網域。

專家建議

  • 務必提供備用圖片,以防 OG 圖片載入失敗
  • 使用社群媒體除錯工具測試 OG 圖片效果
  • 使用描述性 alt 文字以提升無障礙存取
  • 針對頻繁更新的內容,可考慮使用動態 OG 圖片

延伸閱讀