SuperAPI AI 工具集

featured-image-creator

设计与创作

查看项目

更新于 10-16 05:47

技能介绍

用途:为博客文章制作特色图片。成品为 2400x1260px 的干净 SVG 图形,靠插画和图标传达主题,文字不用或极少,标题叠加非必需;随后用 rsvg-convert 转成 PNG,供 WordPress 使用。

规格:viewBox="0 0 2400 1260",宽高比约 1.9:1(接近 16:9)。主要视觉来源为本地插画库(~/Icons/graphics-inspirations/),FontAwesome 图标作点缀,位置在 ~/Downloads/fontawesome-pro-6.4.2-desktop/svgs/。

转换命令: for f in *.svg; do rsvg-convert -f png -w 2400 -h 1260 -o "${f%.svg}.png" "$f"; done 单文件:rsvg-convert -f png -w 2400 -h 1260 -o "output.png" "input.svg"

使用插画:插画是完整 SVG,含内嵌 <style> 与 .st0 等类,viewBox 常见为 0 0 156 156 或 0 0 600 600。需完整读取文件,取出 <svg> 与 </svg> 之间的内容(含 <style>),用嵌套 <svg> 包裹并设置 x/y/width/height 定位,嵌套 viewBox 与原件一致;插画高度约占画布 60-80%(750-1000px),水平居中、略高于垂直中心。

使用图标:读取 SVG 取 <path d> 与 viewBox,用 <g transform="translate(...) scale(...)"> 内联,缩放公式 scale = 目标尺寸 / 图标 viewBox 宽度(图标常见 512 或 640)。资料也列出 Heroicons、Lucide、Simple Icons、Tabler 等在线开源图标可同法嵌入。

视觉风格(每图只选一种,不混用):一是漂浮图标(多数文章、教程、科普),渐变背景加点阵,4-8 个图标分层:前景不透明度 0.9-1.0、中景 0.6-0.8、背景 0.3-0.5 并加 feGaussianBlur,配装饰圆环与散点;二是图标卡片网格(工具对比、插件盘点),白卡片放在点阵上,虚线相连,一张卡片高亮;三是强渐变加中心图标(单一主题、评测、观点、newsletter 头图),一大图标居中或 2-3 个成组,配光晕与同心圆。

限制与缺失:需本地已具备上述插画库与 FontAwesome 资源;资料未提供安装步骤、收费或价格、平台支持范围、效果保证等信息,也未给出完整可运行代码示例,故暂未提供。