code-material-gen

v2026.09.24

代码生成配图素材。用 HTML/CSS + Playwright 渲染高质量中文配图。 不依赖任何AI图片API,100%代码生成,字体可控、像素精确、零成本。 Trigger: "代码生成素材", "配图生成", "素材生成", "code material", "render material".

GitHub
Install command
npx skhub add aaaaqwq/code-material-gen
Markdown
SKILL.md

code-material-gen — 代码生成配图素材

HTML/CSS + Playwright 渲染,全中文手写字体,像素精确,零成本

定位

当素材需要全中文、手写字体、字迹清晰、可复现时使用。替代API生图方案(longform-visual-notes),不消耗任何API额度。

与其他skill的关系

Skill关系
longform-visual-notes互补:API生图 vs 代码生成
content-cover-gen互补:封面场景可用code-material-gen
daily-gzh-content素材生成阶段调用
daily-xhs-content小红书素材(比例改3:4)

快速使用

python3 ~/clawd/skills/code-material-gen/scripts/generate.py \
  --type list \
  --title "三个核心建议" \
  --items "建议一:先用Excel写规则" "建议二:手动执行30天" "建议三:追求稳定性" \
  --font MaShanZheng \
  --palette ink \
  --size 1536x1024 \
  --output /path/to/output.png

素材类型

type用途items格式
timeline时间线/阶段图"阶段一:描述" "阶段二:描述"
compare对比表格(表头第一项)"指标|A|B" "胜率|59%|61%"
list要点列表/编号卡片"标题:描述"
quote金句/引用卡片"金句文字" "作者"
cover文章封面"副标题" "标签1,标签2"
chart数据展示(同list)同list

手写字体

字体风格推荐场景
MaShanZheng马善政楷体✅ 推荐,清晰有力,正文首选
ZCOOLKuaiLe站酷快乐体圆润活泼,适合轻松内容
LiuJianMaoCao刘建毛草草书风格,仅适合大标题
ZhiMangXing芝麻行书行书风格,适合金句卡片

配色方案

palette风格适用
tech深色科技(深蓝底+亮蓝)AI/科技/数据主题
warm暖色纸张(米色底+橙红)经验分享/生活类
ink水墨风(白底+红黑)✅ 推荐,文化感强
minimal极简白(白底+蓝)通用/商务

尺寸建议

平台推荐参数
公众号/抖音16:91536x1024
小红书3:41024x1365
封面16:91920x1080

输出规范

  • ✅ 全中文,无任何英文
  • ✅ 手写字体,清晰可读
  • ✅ 零成本,不消耗API
  • ✅ 可复现,同样参数永远输出一样
  • ✅ <1秒/张,批量生成极快

依赖

  • Python 3 + Playwright(pip install playwright)
  • 中文字体文件在 ~/.fonts/chinese-handwriting/
  • 无需网络,无需API key

更新日志

  • v1.0.0 (2026-04-18): 初始版本
    • 5种素材类型(timeline/compare/list/quote/cover)
    • 4种手写字体(马善政/站酷快乐/刘建毛草/芝麻行书)
    • 4种配色方案(tech/warm/ink/minimal)
Discovery
Tags

No tags published for this skill.

Version
Latest version metadata

Version

v2026.09.24

Published

Sep 24, 2026

Category

Uncategorized

License

MIT

Source path

skills/code-material-gen

Default branch

main

Latest commit

b996aac

Tree SHA

07e787b