Coding Bubble Logo CodingBubble
← Back to Tools

SVG → Jetpack Compose Converter

Paste an SVG icon and get ready-to-use Kotlin ImageVector code for Android Jetpack Compose.

Recent conversions stay in this browser only. Clear them anytime.

SVG Input

Paste or drop an SVG 0 chars
Ln 1, Col 1
0 B

Compose ImageVector

Icon Lab

Paste SVG to see preview

Conversion Report

Waiting for SVG
Paths
0
Elements
0
Warnings
0
Viewport
-

    Conversion data is sent only for processing. Browser history is local to this device.

    Recent Conversions

    Stored only in this browser.

    Your recent SVG conversions will appear here.

    Examples Gallery

    Supported SVG Elements

    <path>
    <rect>
    <circle>
    <ellipse>
    <line>
    <polygon>
    <polyline>
    <g> groups

    All SVG path commands (M, L, H, V, C, S, Q, T, A, Z) are supported in both absolute and relative forms. Fill colors, stroke, opacity, and fill-rule (EvenOdd / NonZero) are preserved.

    SVG to Compose Resources

    Use the converter above for the work. These short guides cover ImageVector exports, custom Compose icons, and path data details without crowding the tool.

    SVG to Compose ImageVector Android Compose SVG icon workflow SVG path to Compose path data VectorDrawable vs ImageVector

    FAQ

    What is an ImageVector?

    ImageVector is Jetpack Compose's built-in vector graphic representation. It replaces Android's XML VectorDrawable format and lets you define icons directly in Kotlin with full type-safety.

    Why not use Android Studio's built-in SVG converter?

    Android Studio converts SVGs to XML VectorDrawable, not Compose ImageVector. This tool skips the XML step and gives you pure Kotlin code you can paste directly into your Compose project.

    Are gradients supported?

    Currently we convert solid fills and strokes. Linear/radial gradients in SVG will be flattened. We recommend simplifying gradients in your SVG editor before converting.