IT-tools

SVG 占位图

生成自定义尺寸、背景色、文字颜色和文案的 SVG 占位图，可预览并下载，适合布局设计和图片缺失场景，本地生成。

预览

预览
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="800" height="400" viewBox="0 0 800 400">
  <rect width="100%" height="100%" fill="#f3f3ef"/>
  <text x="50%" y="50%" fill="#000000" font-family="monospace" font-size="50" text-anchor="middle" dominant-baseline="middle">800 × 400</text>
</svg>

// 工具说明

用于为布局、原型或缺失图片创建轻量占位图。设置尺寸和颜色后，可复制 SVG 源码或直接下载文件，所有生成在浏览器本地完成，SVG 任意缩放都保持清晰，结果可编辑。

// 使用方法

  1. 设置宽度、高度和占位文字。
  2. 选择背景色和文字颜色。
  3. 复制 SVG 或下载文件。

// 常见问题

为什么使用 SVG 占位图？

SVG 任意缩放都清晰，而且通常比位图小得多。

生成后还能修改吗？

可以，SVG 是纯文本，可直接编辑或嵌入页面。

// 相关工具