免费开源博文封面生成器 打造专属封面神器

项目简介

ThisCover 是一个免费且漂亮的封面生成器，基于 rutikwankhade/CoverView 二次开发。项目进行了全面的架构升级，采用现代化技术栈：next.js v16、react v19、shadcn/ui、tailwindcss v4、lucide icons。在原版基础上，重点完成了中文汉化、本土化功能定制和扩展，整体更贴合国内用户的使用习惯。

项目地址：https://github.com/weizwz/cover
在线文档及使用：https://cover.weizwz.com/

核心功能一览

设计定制能力

背景选项

支持多种背景类型：纯色、渐变色、本地上传图片、在线图片链接、Unsplash 图库集成。

输出功能

• 支持 png、jpg、webp 多种格式输出
• 放大倍数 0.5x - 5x 可调
• 复制图片到剪贴板
• 保存配置到本地浏览器
• 一键重置配置

特色功能

• 左文右图主题：支持图片和文本位置互换
• 手机预览主题：图片可拉伸充满框架
• 桌面/手机预览：背景图替换为真机效果图
• 首页展示：功能介绍、常见问题、封面示例
• 一键使用：示例图直接载入使用

环境配置

项目需要配置环境变量，在根目录创建 .env 文件：

NEXT_PUBLIC_API_ACCESS_KEY = 'xxxxx'
NEXT_PUBLIC_API_ICONIFY_URL = 'https://api.iconify.design'
NEXT_PUBLIC_CLOUDFLARE_ANALYTICS_TOKEN = 'xxxxx'

如果不需要 Cloudflare Analytics，请在 src/app/layout.tsx 中注释对应的 Script。

项目亮点

• 完全免费开源：没有付费墙，没有水印限制
• 隐私友好：图片在本地处理，不上传服务器
• 即开即用：无需注册，打开就能用

如何部署及使用

在线使用

如果没有编程或部署基础，直接打开在线地址就能使用：https://cover.weizwz.com/

本地启动

因为项目是纯前端项目，本地需要 node 环境（推荐 node v22.12.0）。

1. 拉取项目
   git clone https://github.com/weizwz/cover.git
   或者
   gh repo clone weizwz/cover
2. 配置 .env
   在项目根目录创建 .env 文件，内容同上。
3. 启动服务
   包管理使用 pnpm，所有命令如下：
   npm install -g pnpm
pnpm install
pnpm dev
   打包使用 pnpm build。

Docker 部署

项目是纯前端，可以将打包产物通过 nginx 镜像部署。Dockerfile 示例：

# ========== Stage 1: Build ==========
FROM node:20-alpine AS builder
WORKDIR /app
COPY package.json pnpm-lock.yaml ./
RUN npm install -g pnpm && pnpm install
COPY . .
RUN pnpm build
# ========== Stage 2: Nginx ==========
FROM nginx:alpine
COPY --from=builder /app/out /usr/share/nginx/html
COPY nginx.conf /etc/nginx/conf.d/default.conf
COPY docker-entrypoint.sh /docker-entrypoint.sh
RUN chmod +x /docker-entrypoint.sh
EXPOSE 80
ENTRYPOINT ["/docker-entrypoint.sh"]

构建镜像：docker build -t my-cover:1.0.0 .
创建 docker-compose.yml：

services:
  cover:
    image: my-cover:1.0.0
    container_name: cover
    ports:
      - "5080:80"
    environment:
      - NEXT_PUBLIC_API_ACCESS_KEY=你的key
      - NEXT_PUBLIC_API_ICONIFY_URL=https://api.iconify.design
      - NEXT_PUBLIC_CLOUDFLARE_ANALYTICS_TOKEN=xxxxx
    restart: unless-stopped

启动：docker-compose up -d

GitHub Pages 部署

GitHub Actions 部署配置（.github/workflows/deploy.yml）已在项目内提供，只需 fork 仓库后设置环境变量即可自动部署。环境变量包括：NEXT_PUBLIC_API_ACCESS_KEY、NEXT_PUBLIC_API_ICONIFY_URL、NEXT_PUBLIC_CLOUDFLARE_ANALYTICS_TOKEN。在仓库 Settings → Secrets and variables → Repository secrets 中添加。然后在 Settings → Pages 中选择 GitHub Actions 作为 Source，再在 Actions 页面手动触发或推送触发即可。

使用体验

整个过程流畅直观，无需任何设计基础。首页也提供了模板，可以直接一键载入使用。

Unsplash API Access Key 注册

如果需要使用 Unsplash 图库，需要注册 API Key。打开 https://unsplash.com/ 登录（国内邮箱即可注册），注册后在邮箱确认激活。然后点击 Developers/API，按照提示注册为开发者，创建应用即可获取 Access Key。

写在最后

开源社区的魅力在于，一个好项目可以被无数人改进、延续。ThisCover 正是这样一个站在前人肩膀上、加入本土化思考的作品。无论你是技术博主、内容创作者，还是单纯想要一张好看封面的普通用户，它都值得一试。