What is an Android Vector Drawable?

A Vector Drawable is an XML format used in Android apps to describe scalable vector graphics. It uses a subset of SVG path syntax wrapped in an Android-specific XML structure with attributes like android:pathData and android:fillColor.

Can I use SVG files directly in Android?

Android does not support raw SVG files natively. You need to convert the SVG to a Vector Drawable XML file before using it in your project. Android Studio has a built-in converter, and this tool provides the same conversion in your browser without installing anything.

What SVG features are lost when converting to Vector Drawable?

Vector Drawable supports path data, fill color, stroke color, and stroke width. It does not support CSS styles, gradients defined inside SVG defs, text elements, filters, or arbitrary SVG transforms. Complex SVGs may need to be flattened or simplified before conversion.

Dev

Vector Drawable ↔ SVG

Paste an Android Vector Drawable to get SVG, or paste SVG to get a Vector Drawable. Converts instantly in your browser. Nothing leaves your device.

On-device
No uploads
Works offline

Vector / SVG converter

Android vector drawable and SVG

Convert:

Vector Drawable input

SVG output

SVG Preview

Preview appears here

Conversion happens on-device. Nothing is uploaded.

About this tool

This converter translates between Android Vector Drawable XML and standard SVG. Both directions run entirely in your browser using string parsing. No server, no upload, no waiting.

Paste your source into the input area and the output updates as you type. Toggle the direction with the segmented control at the top, then hit Copy to grab the result.

Format differences

android:pathData maps to SVG's d attribute. The path syntax is identical.
android:fillColor maps to SVG's fill. Android often encodes colors as 8-digit ARGB hex (e.g. #FF000000); SVG uses 6-digit RGB hex.
android:viewportWidth/Height maps to SVG's viewBox.
Vector Drawable does not support CSS, text, gradients in <defs>, or filters. Those features are dropped on conversion.

Tips

If your SVG uses CSS style attributes, expand them to presentation attributes first (e.g. replace style="fill:#f00" with fill="#f00").
Android Studio's Vector Asset wizard applies the same conversion. Use this tool when you want a fast preview or need to do it outside Android Studio.
For multi-path icons, each <path> is converted individually. Group transforms are not supported.
The 8-digit ARGB hex used by Android (#FF3DDC84) is understood by this converter. The leading two digits are the alpha channel.

About Vector Drawable and SVG conversion

Android apps use Vector Drawable XML instead of raw SVG files because the Android framework can render them natively on API 21 and above without a third-party library. The format borrows the path data syntax from SVG but wraps it in Android XML attributes and adds a viewport size declaration that the system uses to scale the graphic correctly.

From Vector Drawable to SVG

Converting a Vector Drawable to SVG is useful when you want to edit the file in a vector editor like Figma or Inkscape, or when you want to reuse an icon on the web. The converter maps android:pathData to the SVG d attribute and translates color attributes to their SVG equivalents. The android:viewportWidth and android:viewportHeight values become the viewBox.

From SVG to Vector Drawable

To bring an SVG icon into an Android project, every path must be described with plain presentation attributes rather than CSS. The converter reads the SVG viewBox (or width and height if viewBox is absent), maps each <path> to an Android <path> element, and wraps the result in the required <vector> root with the correct namespace declaration.

What is pathData?

The android:pathData attribute uses the same mini-language as the SVG d attribute. It is a compact string of move, line, curve, and close commands. Because both formats share the same syntax, path data can be copied between SVG and Vector Drawable files without any modification.

Frequently asked questions

Why does Android use Vector Drawable instead of SVG?

Android's built-in rendering engine predates broad SVG support. Vector Drawable is a controlled subset that the system can rasterize efficiently, cache as a bitmap, and tint at runtime. It does not need a full SVG parser, which keeps the binary size small.

Does Vector Drawable support all SVG features?

No. Vector Drawable supports paths, fill color, stroke color, stroke width, and some transform attributes. It does not support CSS, text elements, SVG filters, patterns, or <defs>-based gradients. Complex SVGs need to be simplified or flattened before conversion.

Why is Android fill color eight hex digits long?

Android encodes colors as ARGB, where the first two hex digits are the alpha channel. #FF3DDC84 means fully opaque green. SVG uses six-digit RGB hex with a separate opacity or fill-opacity attribute for transparency.

Where do I put the converted Vector Drawable in my project?

Save the file with an .xml extension in res/drawable/. You can then reference it in layouts or code as @drawable/your_icon_name. No density-specific folders are needed; the system scales vector drawables to any size.