SVG 图标构建器

x-init="restore()" >

无需将设计发送到任何地方,即可创建简单 SVG 图标。选择 12 个内置符号之一,再设置输出尺寸、描边宽度和颜色、填充、背景色与圆角半径。成品使用固定的 24×24 viewBox,可复制 SVG 代码或下载 SVG 文件。

四步创建图标

  1. 1

    选择符号

    可选心形、星形、对勾、叉号、圆形、方形、三角形、箭头、闪电、月亮、太阳或铃铛。这些是固定预设,不是自由绘图画布。

  2. 2

    设置输出尺寸

    可将宽度和高度设为 32 到 256 px。内部 viewBox 始终为 24×24。

  3. 3

    调整样式

    将描边设为 0.5 到 6,选择颜色、无填充、currentColor 或描边颜色,再设置背景和圆角。

  4. 4

    复制或下载

    复制生成的 SVG 代码或下载文件。下载文件使用预设名称,例如 heart.svg。

此工具生成的内容

导出文件包含一个 24×24 SVG、背景矩形和一个预设符号,适合模型、小型界面或原型。它不能导入图稿、编辑路径点、添加文字,也不能根据提示生成自定义图标。

填充、使用与隐私

轮廓图标请选择无。使用内联 SVG 时,currentColor 会让填充跟随父元素的 CSS color。背景矩形始终包含在导出内容中。图标在浏览器内生成,设置不会发送到我们的服务器。两步流程中,设置会暂时保存在此标签页的会话存储中以显示结果。

常见问题

不可以。此工具仅为 12 个内置符号设置样式。需要绘制或编辑路径命令时,请使用 SVG 路径编辑器。

不可以。所有导出均使用 24×24 viewBox。只能将输出宽高设为 32 到 256 px。

不会。SVG 在浏览器中生成,设置不会发送到我们的服务器。

相关工具

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