←Studio/15 · Vector StudioLive Code Studio

SVG Viewer & Code Editor

Inspect, live edit SVG markup, tweak parameters and colors, paste raw code directly, and save as optimized SVG or hi-res PNG.

Valid SVG

<rect width="200" height="200" rx="44" fill="#090D16" />

<circle cx="100" cy="100" r="68" fill="none" stroke="url(#primaryGrad)" stroke-width="6" filter="url(#studioGlow)" />
  <circle cx="100" cy="100" r="54" fill="none" stroke="#262E40" stroke-width="2" stroke-dasharray="4 4" />

<g stroke="#FFFFFF" stroke-width="4.5" stroke-linecap="round" stroke-linejoin="round" fill="none">
    <path d="M116 72 L156 142" stroke="#818CF8" />
    <path d="M84 72 L164 72" stroke="#C084FC" />
    <path d="M68 100 L108 170" stroke="#38BDF8" />
    <path d="M84 128 L44 58" stroke="#818CF8" />
    <path d="M116 128 L36 128" stroke="#C084FC" />
    <path d="M132 100 L92 30" stroke="#38BDF8" />
  </g>

<circle cx="100" cy="100" r="16" fill="url(#primaryGrad)" />
  <circle cx="100" cy="100" r="6" fill="#FFFFFF" />
</svg>

32 lines·1.4 KB

Backdrop:

100%

200 × 200 pxviewBox: 0 0 200 200

6 paths·18 elements·1.4 KB