cover-design

Installation
SKILL.md

Cover Design · 代码驱动的封面设计

用 HTML/CSS 写封面,然后用 Chrome DevTools MCP 截图成 PNG。字体精确可控,适合视频缩略图、文章题图、社交分享卡这类对文字位置敏感的场景。

cover-image 的分工

cover-image cover-design (本 skill)
渲染方式 AI 生图 (Replicate gpt-image-2) HTML/CSS + 浏览器截图
视觉风格 手绘 / 插画 / 编辑设计 排版驱动 / typography hero
文字精度 AI 渲染的文字常常模糊 / 错字 100% 精确
适合 文章题图 / 抽象概念 / 美术导向 视频缩略图 / 大标题 / 品牌一致性
风格扩展 通过 prompt 调整 通过新增 HTML 模板扩展

需要 thumbnail 在 160px 缩略图也读得出大字 - 用本 skill。 需要插画美感和氛围 - 用 cover-image

适用场景

Installs
113
GitHub Stars
121
First Seen
May 30, 2026
cover-design — sugarforever/01coder-agent-skills