SVG 工具

SVG Background Generator

用颜色、渐变和重复图案制作 SVG 背景,按需要设置尺寸并下载。

SVG 内容仅在您的浏览器中处理,不会上传到服务器。

这个工具是什么

SVG Background Generator 适合为封面、卡片和演示文稿制作简洁背景。选择一种背景类型,调整颜色、尺寸和图案密度,即可得到独立 SVG,无需提供原始图片。

如何使用

  1. 选择纯色、线性渐变、径向渐变或重复图案。
  2. 设置画布宽高,或选择适合用途的常见尺寸。
  3. 调整颜色、渐变方向或图案参数,并查看预览。
  4. 复制 SVG 或下载 background.svg;需要 PNG 时使用下方的 SVG → PNG 工具。

功能说明

  • 支持纯色、双色线性渐变、双色径向渐变,以及圆点、网格和条纹图案。
  • 可调整宽高、颜色以及相应模式的角度、中心、半径或图案间距。
  • 输出是完整的独立 SVG,放大后矢量背景仍保持清晰。

选择背景与输出尺寸

  • 横屏背景可使用 1920 × 1080,卡片封面可使用 1200 × 630,方形图片可使用 1080 × 1080,也可填写自定义尺寸。
  • 渐变颜色之间平滑过渡;图案按固定间距重复,适合制作规则底纹。
  • 本工具下载 SVG。需要固定像素尺寸或应用不支持 SVG 时,可将下载文件交给 SVG → PNG 或 SVG → JPG。

SVG 安全说明

预览使用经过安全处理的静态副本,不运行脚本、点击事件或动画,也不加载外部图片、字体和样式。外部引用、内嵌网页和不支持的内容会被移除,因此预览可能与原文件不同。含 DOCTYPE 或自定义实体的文档不受支持。

SVG 文件或 UTF-8 源码最多 2 MiB,最多 20000 个节点(包括元素和文本),嵌套深度最多 96 层。内容过大或结构过于复杂时,请先简化文件。

隐私

SVG 内容仅在您的浏览器中处理,不会上传到服务器。

工具不会自动保存输入或结果。请在清空或离开页面前下载需要保留的文件,并保留原始副本。

FAQ

SVG 背景为什么放大后通常不会模糊?

纯色、渐变和图案使用矢量描述,浏览器会根据显示尺寸重新绘制,而不是放大固定像素。

SVG Gradient 是什么?

它描述颜色在位置之间的渐变。线性渐变沿一个方向变化,径向渐变从中心向外变化。

SVG Pattern 是什么?

Pattern 是重复使用的小块图案,例如圆点或网格。调整间距和尺寸可以改变背景的疏密。

如何把 SVG 背景转换为 PNG?

先下载生成的 SVG,再打开相关工具中的 SVG → PNG,选择该文件并设置导出尺寸即可。

返回开发者工具分类首页