Softonic

调整 SVG 大小

步 1 / 2
下一步

SVG 是矢量格式，因此与分辨率无关，在任何尺寸下都保持锐利。“调整” SVG 的大小并不会将其栅格化，也不会改动图形：此工具只是在根元素 <svg> 上设置新的 width 和 height（以像素为单位），也就是它声明的显示尺寸。viewBox、路径以及每个坐标都保持原样，因此图形保留其比例，也不会损失质量。粘贴你的标记，设置宽度和高度，预览结果，然后复制或下载。

如何调整 SVG 大小

  1. 1

    粘贴 SVG

    将完整的 `<svg>...</svg>` 标记粘贴到文本框中。

  2. 2

    设置宽度和高度

    以像素为单位输入新的宽度和高度。

  3. 3

    实时预览

    此工具会重写根 `<svg>` 上的 `width` 和 `height`（若缺失则添加），并立即显示结果。

  4. 4

    复制或下载

    将更新后的标记复制到剪贴板，或另存为 `.svg` 文件。

显示尺寸与 viewBox

一个 SVG 拥有显示尺寸（width/height）和它自己的坐标系（viewBox）。

<svg width="200" height="200" viewBox="0 0 100 100">
    <circle cx="50" cy="50" r="40" />
</svg>

这个 SVG 在屏幕上是 200 × 200 像素，而它的内部坐标为 0 到 100。r="40" 的圆约占 viewBox 的 80%，因此渲染宽度约为 160 px。此工具只更改 width 和 height，也就是声明的显示尺寸。它不会触碰 viewBox 或坐标，这正是图形保留比例并保持锐利的原因：你是在告诉浏览器以不同尺寸绘制同一幅图，而不是重绘它。

为什么更改尺寸后 SVG 看起来可能没变

如果 SVG 用类似 <img src="icon.svg" width="500"> 的方式放置，或由 CSS 设定尺寸，那么周围的页面会控制显示尺寸，并覆盖文件中的 width/height。这种情况下，请在使用 SVG 的地方（<img>、CSS 或容器）更改尺寸，而不仅仅在标记内部。

描边和文字保持锐利

由于没有任何内容被栅格化，文字仍是真正的矢量文字，线条在任何尺寸下都保持平滑。描边宽度在坐标系中定义，因此会随图形一起缩放。若你希望某条描边无论尺寸如何都保持相同的视觉粗细，请在调整大小之前，在源文件中为该元素添加 vector-effect="non-scaling-stroke"。

保持标记整洁

从 Figma、Illustrator 或 Sketch 导出的 SVG 常带有多余负担：编辑器命名空间（sodipodi:、inkscape:）、隐藏的元数据和未使用的 <defs>。除尺寸外，此工具会原样保留你的标记。要去除这些冗余，请在调整大小之前或之后，用 SVGO 这样的优化器处理该文件。

常见问题

不会。它只在根 <svg> 上设置 width 和 height。viewBox、路径以及每个坐标都保持不变，因此图形保留其精确比例。

通常是页面在控制尺寸：<img> 上的宽度、一条 CSS 规则或一个容器覆盖了文件自身的尺寸。请在使用 SVG 的地方更改尺寸，而不仅仅在标记中。

会。SVG 是矢量格式，因此没有任何内容被栅格化，文字和描边在任何尺寸下都保持锐利。如果源文件已将文字转换为路径，它会像其他任何形状一样缩放，并且仍然锐利。

会。只更改 width 和 height；SVG 内部的 <animate>、<script>、事件处理程序和 CSS 都保持不变。

标记会发送到我们的服务器以渲染调整后的预览，并在请求结束后不予保存。它不会被存储或分享。

相关工具

材质设计颜色选择器

浏览Material Design色板，单击即可将任意色号（50至A700）以HEX、RGB或 HSL 格式复制。

ARW 转 JPG 转换器

将索尼 ARW RAW 照片转换为 JPG。无需打开 Lightroom，即可从相机 RAW 文件得到一张便于分享、通用兼容的 JPEG。

报纸制作工具

使用你自己的标题和文章制作报纸风格的头版，然后复制、下载纯文本，或打开浏览器打印对话框。

旗帜制作器

在浏览器中使用六种布局、颜色、文字和符号设计简洁的自定义 3:2 旗帜。可下载 SVG 或 PNG，或打开浏览器打印对话框。

ICO到PNG格式转换器

查看 ICO 中的图像，选择一个尺寸，并在浏览器中按原始大小保存为透明 PNG。

在线白板

在浏览器中的私人白板上绘制想法，排列形状、便签和本地图片。支持撤销操作，并导出 PNG、JPEG、SVG 或可编辑的 JSON。

此工具还提供其他语言版本