简介

在数字化时代，一张吸引人的封面图片对于博客来说至关重要。它不仅能够提升文章的视觉效果，还能在第一时间吸引读者的注意力。制作封面的方法多种多样，从自行设计到基于现有模板进行修改，每种方式都有其独特之处。然而，如果你希望以最快捷的方式输入标题或基本信息，直接生成封面，那么在线封面生成器无疑是你的最佳选择。今天，就让我带你一起探索几款优秀的在线封面生成工具，为你的技术博客增添一抹亮色。

CoverView：开发者的首选

链接： CoverView | GitHub 仓库

CoverView 以其丰富的内置模板和图标而著称，尤其是针对编程语言的图标，这使得它成为开发者制作技术博客封面的理想工具。无论是 Java、Python 还是 React，你都能在这里找到合适的图标和模板，快速打造出专业且符合技术氛围的封面。

Cover-Image-Generator：灵活调整，创意无限

链接： Cover-Image-Generator | GitHub 仓库

虽然没有内置模板，但 Cover-Image-Generator 的灵活性却为其赢得了众多粉丝。你可以自由移动标题和副标题的位置，调整字体、颜色和大小，直至达到满意的效果。这种自由度让创意无限延伸，为你的博客封面增添个性色彩。

PicProse：简洁而不简单

链接： PicProse | GitHub 仓库

PicProse 以其简洁的界面和实用的功能著称。它提供了基本的封面设计元素，让你能够快速上手，同时又不失专业感。无论是简单的文字封面还是需要添加图片的复杂设计，PicProse 都能轻松应对。

imgsrc：个性化定制，彰显特色

链接： imgsrc | GitHub 仓库

imgsrc 允许你上传自定义图标和图片，为封面增添个性化元素。此外，它还提供了多种背景和布局选择，让你能够根据博客内容定制专属封面。无论是展示网站还是横向图片，imgsrc 都能帮你实现。

Free Open Graph Generator：无水印，更专业

链接： Free Open Graph Generator

基于 imgsrc 修改而来的 Free Open Graph Generator 去掉了水印功能，让你的封面看起来更加专业。它保留了 imgsrc 的实用功能，同时提升了封面的整体美感。

OG Image Maker：模板丰富，自定义度高

链接： OG Image Maker

OG Image Maker 内置了多种模板供你选择，同时支持修改颜色、背景图片和底部的按钮等元素。这种高度的自定义性让你能够打造出独具特色的博客封面。

Open Graph Image Generator：专注网站展示

链接： Open Graph Image Generator

这款生成器特别适合用来展示网站或横向图片。虽然上传的图标大小固定，但其专业的设计感使得它成为展示网站内容的理想选择。

Free Open Graph Image Generator - Placid.app：简洁实用

链接： Free Open Graph Image Generator - Placid.app

Placid.app 提供的这款生成器界面简洁明了，操作简便。你只需输入标题和副标题，选择合适的布局即可生成满意的封面图片。

Open Graph Image Generator | BoilerplateHub：快速生成，简单高效

链接： Open Graph Image Generator | BoilerplateHub

BoilerplateHub 的这款生成器以其快速和简单著称。它提供了两种布局选择，让你只需输入标题和副标题即可生成封面。对于追求效率的博主来说，这是一个不可多得的工具。

Vercel OG Image Playground：官方出品，品质保证

链接： Vercel OG Image Playground

作为 Vercel 官方推出的 OG 图像生成器，这款工具提供了高质量的设计体验。你可以在右下角导出 svg 格式的图片，如果需要 png 格式，只需在右上角的 tab 栏中切换到 png（satori + resvg-js）模式。无论是设计感还是实用性，Vercel OG Image Playground 都堪称一流。

cover-paint：自部署，灵活使用

链接： cover-paint | GitHub 仓库

虽然目前官网可能无法访问，但你可以通过 GitHub 仓库在 Vercel 或 Netlify 等平台自行部署使用。cover-paint 提供了丰富的自定义选项，让你能够根据个人需求打造独特的封面设计。

总结

目前正在使用 CoverView , 不过每次都需要去配置 + 下载 + 移动到博客目录, 感觉还是有很多步骤要手动操作. 而 Free Open Graph Generator 提供了图像生成的 API, 那么就自动化生成 cover 提供了可能.

目前是这样打算的:

1. hexo 编译时通过钩子获取博客文章的元数据, 然后构建 API 参数调用后端自建的随机 API 接口;
2. 新增一个随机 API 接口, 用于处理 cover 的生成:
   1. 根据 abbrlink 获取 CDN 图片,如果存在则直接返回;
   2. 如果不存在则调用 Free Open Graph Generator 接口生成并转换为 webp, 上传到图床, 最后返回 CDN 地址;

感觉这一套组合拳下来, 博客 cover 图片的问题就彻底解决了.

其实这类图片可以使用 Open Graph 协议 来生成, 像这类的项目非常多, 比如:

• https://github.com/sanwebinfo/og-image
• https://github.com/samholmes/node-open-graph?tab=readme-ov-file
• https://github.com/kvnang/workers-og
• https://github.com/kentaro-m/catchy-image
• https://github.com/svycal/og-image?tab=readme-ov-file

最核心的图像生成已经有了, 那么剩下的就是将整个流程串联起来, 实现自动化生成博客文章的 cover 图像.

等实现了再来水一篇博客 🙉.