设计配色

背景 CSS Base64 / URI 注入器

别再到处存大量零碎小 SVG 图片文件了！将代码扔进来，采用最极致安全的 URL 编码或是传统 B64，瞬间转换为 `background-image: url(...)` 安全挂载字符串。

DesignCSSHTMLFrontend

收藏工具

当前还没有选择收藏模式。

快捷操作

你可以复制当前工具页链接，或在支持的设备上调用系统分享。

设计配色

SVG 数据内联转义

1. Raw SVG Code

2. CSS Ready URL() Encoded String

3. Live Render Background Preview

背景尺寸重复方式背景位置

Use Base64 (Instead of URI Escape) Wrap Double Quotes 压缩 SVG 空白 -

等待输入 SVG。

SVG code

<svg>X</svg>

CSS Set

url(data:image/svg...)

如今推荐 URI 编码（不勾选B64），因为转义并丢充气括号后它体积更小且在 F12 里依然是人看的懂的结构。

工具列表