Paste Android VectorDrawable XML for an instant SVG preview. Renders path, group, clip-path, gradients, and tint in the browser, then export SVG or PNG.

View
Background
Zoom
Theme color
Tint
Lines: 0 Columns: 0 Selection: 0 chars
Preview

Usage

  • Paste VectorDrawable XML on the left, or use Sample / Open file. Preview updates as you type.
  • Background, zoom, RTL, tint, and theme color only change the preview. Source XML stays as-is.
  • Copy or save SVG, or save PNG. Nothing is uploaded.

Input, output, limits

Input is VectorDrawable XML or a .xml file. Output is a live SVG preview plus SVG/PNG export. animated-vector renders only the inner static <vector>. @color/?attr resolve to the theme color. Drafts stay in this device’s local storage for 30 days.

Example

The official battery-charging sample — <vector> with a rotated <group> and <path android:fillColor="#AARRGGBB"> — previews as a tilted battery icon.

VectorDrawable syntax

  • <vector>: viewportWidth/Height, width/height (dp), alpha, tint, autoMirrored
  • <path>: pathData, fillColor, fillAlpha, fillType (evenOdd/nonZero), strokeColor, strokeWidth, strokeLineCap/Join
  • <group>: rotation, pivotX/Y, scaleX/Y, translateX/Y applied to children
  • <clip-path>: clips drawing in the same group
  • Colors: #RGB / #ARGB / #RRGGBB / #AARRGGBB. Android puts alpha first.
  • API 24+ linear and radial gradients via aapt:attr. Sweep is approximated/warned.
  • Theme attrs such as ?attr/colorControlNormal use the Theme color control.

FAQ

Is XML uploaded?
No. Paste, files, preview, and export stay in the browser. Drafts are saved only on this device.
Does AnimatedVectorDrawable play?
No. Only the static <vector> inside <animated-vector> is drawn. ObjectAnimator playback is not supported.
Why is the color wrong?
Android fillColor is #AARRGGBB (alpha first), not SVG #RRGGBBAA. @color and ?attr cannot be resolved without project resources, so they use Theme color.