设计与配色

生成SVG徽章

生成SVG徽章 — 指定尺寸或颜色,查看代码或结果. 输入指南: 徽章文本, 背景颜色, 颜色. 无需账号.

无需账号

正在加载工具…

使用方法

  1. 1输入指南: 徽章文本, 背景颜色, 颜色.
  2. 2运行工具并查看结果。
  3. 3复制结果 / 保存结果文件.

使用提示

请检查输入范围和单位。结果取决于您的输入和浏览器。

广告可能处理连接数据,个性化遵循您的隐私选择。 隐私说明(英语)

实际输入与输出示例

以下结果由此工具的实际引擎使用示例值计算,不使用个人输入或已保存工作。可在工具中载入示例查看相同输入。

示例输入

字段值
徽章文本
Saemol
背景颜色
#0F766E
颜色
#FFFFFF

示例结果

<svg xmlns="http://www.w3.org/2000/svg" width="320" height="80" viewBox="0 0 320 80"><rect width="320" height="80" rx="16" fill="#0F766E"/><text x="160" y="40" text-anchor="middle" dominant-baseline="central" font-family="sans-serif" font-size="24" fill="#FFFFFF">Saemol</text></svg>

相关工具

全部工具