它是一个SVG 图标“改造器”。
SVG 是一种矢量图形格式，做网页图标很常用。但有时候你不想把 SVG 当图片文件引用，而是想直接嵌进 CSS 里当背景图——这时候就得把 SVG 代码编码成一长串字符（Data URI 或 Base64）。
手动转这个很麻烦，格式还容易搞错。这个小工具帮你一键转换，还顺便在左边实时预览图形、告诉你尺寸和属性。
主要能做什么？
SVG 转 Data URI：输出 CSS 里 url() 能直接用的格式。
SVG 转 Base64：另一种常用的嵌入编码。
生成完整 CSS 规则：直接给出一段 .svg-icon { ... } 样式代码，复制走就能用。
实时预览：左边一个小方框，实时显示 SVG 图形长什么样。
图形属性解析：
尺寸/ViewBox（比如 24×24 或 0 0 24 24）
文件体积（Bytes 或 KB）
填充/描边颜色
节点元素数量
上传 SVG 文件：不想粘代码？点按钮选一个 .svg 文件，自动读入并转换。
示例 SVG：点一下自动填入一个图标示例，直接看效果。
一键复制：三个结果区各有一个复制按钮。
清空重置：一键清空。
适合谁用？
前端开发者：做 CSS 图标、内联 SVG 时快速编码。
网页设计师：不想用图片文件，用 CSS 嵌 SVG 图标。
做邮件模板的人：邮件里嵌 SVG 常需要 Data URI。
做小图标库的人：批量转换 SVG 图标。
学 CSS 的人：理解 SVG 怎么嵌进 CSS。
任何需要把 SVG 塞进 CSS 的人。
用起来是什么感觉？
打开页面，上面是双栏布局：
左边是一块预览区：
尺寸/ViewBox
文件体积
填充/描边颜色
节点元素数量
一个小方框，实时显示 SVG 图形（初始写着“无预览”）
下面是四块小信息面板：
右边是代码编辑区：
上传 SVG：选本地文件
示例 SVG：填入示例图标
清空/重置：清空重来
转换 CSS（绿色）：点一下开始转换
一个大文本框，粘 SVG 代码
下面是四个按钮：
转换成功后，下面是结果区，三块：
Encoded SVG (Data URI)：一长串编码，CSS 里 url() 直接用
CSS Code (完整规则代码)：一段 .svg-icon { ... } 样式，复制走就能用
Base64 Code：Base64 编码格式
每块右上角都有“复制”按钮。
操作流程就是：
把 SVG 代码粘到右边（或点“上传 SVG”选文件）
点“转换 CSS”
左边立刻出现图形预览和尺寸、颜色等信息
下面三块结果任你复制
整个流程就是 “粘进去 → 点转换 → 看预览 → 复制走”，几秒钟搞定。
对做网页图标、CSS 背景图的人来说，比手动编码、手动查尺寸快多了，也不容易出错。