📥 如何输入内容
你可以通过顶部标签切换输入方式:"粘贴代码"、"上传SVG文件" 或 "上传图片"。
在手机上,点击上传区域即可从相册或文件管理器选择文件;支持从其他应用拖拽文件到浏览器(部分浏览器支持)。
💡 上传图片后会自动生成带"数量"文字的SVG气泡,并立即打开预览调整。
🎨 提取与替换颜色
点击 "🔍 提取所有颜色" 会列出代码中所有的十六进制颜色值。
勾选 你想要修改的颜色(可多选),在下方输入新颜色值(例如 #ff0000 或留空表示删除),然后点击 "⚡ 替换" 即可。
顶部工具栏支持 全选/取消全选 以及 复制颜色列表。
🎈 气泡预览与导出
点击 "🎈 气泡预览" 打开实时预览面板,你可以调整:
• 文字位置(X/Y坐标)和字号大小
• 字体颜色、字体名称、文本内容
• 描边粗细以及画布背景颜色
调整满意后点击 "📋 导出气泡格式" 即可复制完整的SVG代码。
💡 推荐使用 "📐 转为阅读格式" 快速生成居中文字的气泡图,适合制作阅读量展示。
🛠️ 工具区
• 🖼️ 预览SVG:在新窗口中查看SVG渲染效果。
• 🔧 工具:展开后可访问在线SVG转换服务,支持自定义链接。
⌨️ 快捷键(外接键盘时)
• Esc 关闭所有弹窗和面板
• Ctrl + Enter 快速提取颜色
⚠️ 注意事项
• 本工具是纯静态网页,无法保存数据,刷新或关闭页面后内容会丢失,请及时导出代码。
• SVG预览仅支持纯SVG代码,不支持直接预览阅读格式的气泡(如需预览请点击"气泡预览")。
• 默认图片转SVG工具生成的代码通常较大,会导致气泡文件体积膨胀,可自行替换更优的转换服务。
• 上传的图片最好提前处理(如去除背景、裁剪多余空白),能有效减小最终代码。
• 生成代码的大小主要取决于图片像素尺寸、压缩等级、是否透明等因素。测试:上传127KB的图片,最终代码约170KB。
📌 精简技巧(按优先级)
① 裁剪画布多余空白,缩小宽高
② 导出为PNG-8高压缩格式(适合卡通图标)
③ 避免透明通道,使用不透明图片
④ 导出时清空图片元数据(时间、软件信息等)
⑤ 纯色、色块类图案压缩效率更高,复杂照片很难大幅缩减
📱 本工具针对手机触摸操作优化,所有按钮都适合手指点击,弹窗可通过点击遮罩或关闭按钮退出。