| name | cover-art-studio |
| description | Use when: 生成博客封面、课程头图、知识库分享头图、900x363 宽屏图、HTML/SVG 封面设计。负责把文章主题转成原创、可截图、适配社交媒体裁剪的视觉封面。 |
| argument-hint | <文章 frontmatter/标题/摘要> |
| user-invocable | true |
| metadata | {"author":"chao"} |
Cover Art Studio
cover-art-studio 是知识库封面图工作室。它用 HTML/SVG/CSS 生成高质感头图,让文章在知识库、公众号和社交媒体里都有统一视觉识别。
适用场景
- 为文章、课程、专题生成封面图。
- 用户要求“生成头图”“做封面”“900x363 图片”。
- 需要一个可被浏览器截图的 HTML 封面。
- 需要兼顾宽屏展示和 1:1 社交媒体裁剪。
设计规格
- 默认尺寸:900 × 363。
- 中央安全区:约 383 × 383,核心文字和图形必须落在安全区内。
- 输出形式:自包含 HTML,优先使用 CSS 与 SVG,不依赖外部图片。
- 风格:干净、专业、有科技感,但不过度装饰。
设计流程
- 提炼主题:从标题、摘要、标签中提取核心意象。
- 确定视觉隐喻:例如“图谱、流水线、引擎、层级、网络、坐标系”。
- 设计版式:先保证安全区,再做背景延展。
- 生成 HTML:输出完整可预览页面。
- 截图建议:用浏览器打开 HTML,按 900 × 363 截图。
质量标准
- 一眼能看出主题,不只是好看。
- 文字不拥挤、不截断。
- 色彩统一,避免廉价渐变和过度光效。
- 缩成小图后仍能识别标题和核心意象。
配套资源