SVG 环形图生成器

SVG 环形图生成器

输入标签和值生成可复制的 SVG 环形图。

输入内容2 项
处理结果10 行
<svg width="640" height="360" viewBox="0 0 640 360" xmlns="http://www.w3.org/2000/svg">
  <circle cx="180" cy="180" r="110" fill="none" stroke="#7057ff" stroke-width="42" stroke-dasharray="64 36" stroke-dashoffset="25" pathLength="100"/>
  <circle cx="180" cy="180" r="110" fill="none" stroke="#ff8a00" stroke-width="42" stroke-dasharray="21 79" stroke-dashoffset="-39" pathLength="100"/>
  <circle cx="180" cy="180" r="110" fill="none" stroke="#2563eb" stroke-width="42" stroke-dasharray="9 91" stroke-dashoffset="-60" pathLength="100"/>
  <circle cx="180" cy="180" r="110" fill="none" stroke="#ef4444" stroke-width="42" stroke-dasharray="6 94" stroke-dashoffset="-69" pathLength="100"/>
  <text x="360" y="110" font-size="15" fill="#334155">Chrome: 64</text>
  <text x="360" y="140" font-size="15" fill="#334155">Safari: 21</text>
  <text x="360" y="170" font-size="15" fill="#334155">Edge: 9</text>
  <text x="360" y="200" font-size="15" fill="#334155">Firefox: 6</text>
</svg>

SVG 环形图生成器说明

SVG 环形图生成器是 CLIS.CC 按常用在线工具使用习惯整理的小工具，适合在浏览器中快速完成数据格式化、编码解码、文本整理、配置转换、单位换算和代码片段生成。工具默认采用左侧输入、右侧输出的一屏结构，常用选项集中在输入区顶部，输入内容后会即时生成结果，不需要额外跳转页面，也不会打断原有编辑流程。

输入标签和值生成可复制的 SVG 环形图。在实际使用中，你可以把接口返回、配置文件、URL 参数、文本列表或样式片段直接粘贴到输入区，再根据需要调整处理方式。右侧结果区保持纯文本展示，方便选择、滚动和复制，适合开发调试、运营整理、SEO 文案处理、文档排版和日常办公场景。