SVG 生成器技能

为网站、演示文稿等生成美观、可定制的SVG背景和图形。

功能特点

• - 4种风格：科技、简约、几何、抽象
• 5种配色方案：蓝紫色、灰蓝色、青绿色、绿蓝色、自定义
• 本地运行：无API成本，完全免费
• 网页就绪：响应式设计，针对网页使用优化

快速开始

bash

生成科技风格背景

svg-generator --style tech --colors blue-purple --output hero-bg.svg

生成简约背景

svg-generator --style minimal --colors gray-blue --output simple-bg.svg

生成几何图案

svg-generator --style geometric --colors teal-cyan --output pattern-bg.svg

生成抽象艺术

svg-generator --style abstract --colors green-blue --output art-bg.svg

可用风格

风格	描述	最佳用途
tech	抽象科技元素（数据流、节点、电路）	科技网站、SaaS落地页
minimal

简洁的渐变和形状 | 专业网站、作品集 | | geometric | 数学图案和几何形状 | 现代设计、仪表盘 | | abstract | 艺术抽象构图 | 创意项目、社交媒体 |

配色方案

方案	颜色	使用场景
blue-purple	科技蓝到紫色渐变	SaaS、科技产品
gray-blue

专业灰到蓝色 | 企业、商务 | | teal-cyan | 现代青绿到青色 | 清新、现代设计 | | green-blue | 自然灵感绿到蓝色 | 环保、健康品牌 | | custom | 指定自定义十六进制颜色 | 品牌特定需求 |

高级用法

自定义颜色

bash svg-generator --style tech --colors #FF6B6B-#4ECDC4 --output custom.svg

生成PNG

bash

先生成SVG，然后转换

svg-to-png input.svg output.png --width 1920 --height 1080

捆绑资源

脚本

• - scripts/generate-svg.js - 主SVG生成脚本
• scripts/svg-to-png.js - 将SVG转换为PNG
• scripts/ppt-image-generator.js - 为PPT模板生成图片

资源文件

• - assets/ - 供参考的示例SVG输出

集成示例

网站英雄区背景

bash svg-generator --style tech --colors blue-purple --output public/hero-bg.svg

社交媒体帖子

bash svg-generator --style abstract --colors teal-cyan --output social-post.svg svg-to-png social-post.svg social-post.png --width 1080 --height 1080

演示文稿幻灯片

bash ppt-image-generator --template modern --output slide-bg.svg

相关技能

• - pptx-2 - 用于将SVG集成到PowerPoint演示文稿中
• diagram - 用于在生成背景的同时生成图表