0
100
200
300
400
500
600
700
800
900
1000
1100
0
100
200
300
400
500
600
700
800
900
1000
1100
Figma plugin#16 in Developers

SVG Converter

Boosting your workflow efficiency: transforming your icons into code instantly!

by Mit Fleg

users
39K
likes
123
saves
3.1K
comments
6
Open in Figma
FreeWorks inFigma DesignFigJam
Price
Free
Latest version
v8 · Feb 28, 2024
First published
Nov 15, 2021
Publisher
Mit Fleg
Features

What SVG Converter does

Summarised from Mit Fleg's description on the Figma Community.

  • Launch the plugin and authenticate

  • In the Figma layout, select the frame you need

  • </svg>.

  • The SVG in CSS format will look like this

    background: url(...).

  • The SVG in IMG format will look like this

    <img src="...">.

  • The selected frame will be converted into code and automatically copied to your clipboard

  • Paste the copied code into your code editor by pressing CTRL+V or by…

On this page
Overview

About SVG Converter

SVG Converter is a free Figma plugin published by Mit Fleg in 2021. It works in Figma Design and FigJam and has 38,656 users and 123 likes on the Figma Community. It ranks #16 in Developers on our lists.

In the developer's words

Guide for using the plugin to generate SVG code from a selected frame or image

  1. Launch the plugin and authenticate.
  2. In the Figma layout, select the frame you need.
  • In the plugin, press the button that corresponds with the desired SVG code format: HTML, CSS, or IMG.The SVG in HTML format will look like this: <svg>...</svg>.
  • The SVG in CSS format will look like this: background: url(...).
  • The SVG in IMG format will look like this: <img src="...">.
  1. The selected frame will be converted into code and automatically copied to your clipboard.
  2. Paste the copied code into your code editor by pressing CTRL+V or by right-clicking in the code editor field.
Changelog

What's new

Version 8 · released Feb 28, 2024

The developer didn't publish release notes for this version.

Trust

Permissions and privacy

Network access

SVG Converter can only connect to the domain declared in its manifest: code.jquery.com.

  • code.jquery.com

Extra permissions

  • Reads your Figma name and avatar

Read from the plugin's published manifest.

Rankings

Where SVG Converter ranks

Compare

SVG Converter alternatives

  1. 1

    Zeplin

    by Zeplin Crew

    291K users2.9KFree + paid features

    Design tools are for designing. Zeplin is for clear, structured design delivery.

    View details
  2. 2

    Inspect Styles

    by max.denaro

    136K users3.9KFree

    Inspect styles from Figma and transform to CSS

    View details
  3. 3

    DesignDoc [Spectral]: Measures, Annotations, and Handoff

    by Marka Plugin Dev

    132K users3KFree

    📐 Effortlessly hand off your Figma designs to the development team

    View details
  4. 4

    Figma Exporter

    by JerryKhw

    112K users490Free

    Easily export assets as PNG/JPG/WebP/SVG/PDF for Web, Android, Flutter, iOS, React Native

    View details
  5. 5

    Tailwind CSS Color Generator

    by Erik de Vries

    108K users3.6KFree

    Create custom Tailwind CSS color scales based on a given Hex code or HSL color

    View details
  6. 6

    Jira

    by Figma Community

    81K users552Free

    Connect Figma Designs to Jira Issues

    View details
FAQ

SVG Converter FAQ

What does SVG Converter do?

Boosting your workflow efficiency: transforming your icons into code instantly. It's a Figma plugin by Mit Fleg that runs in Figma Design and FigJam.

Is SVG Converter free?

Yes. SVG Converter is free to install and run from the Figma Community, with no paid tier listed.

Is SVG Converter safe to use?

Figma plugins can only reach the internet through domains listed in their manifest. SVG Converter can only connect to the domain declared in its manifest: code.jquery.com. As with any plugin, check the developer's privacy policy before using it on client work.

How do I install SVG Converter?

Open it on the Figma Community, or search for it in the Actions menu (Cmd/Ctrl + K) inside any file you can edit. See how to install Figma plugins.

What are the best alternatives to SVG Converter?

By user count, the closest alternatives are Zeplin, Inspect Styles and [DesignDoc [Spectral]: Measures, Annotations, and Handoff](/plugins/designdoc-spectral-measures-annotations-and-handoff/). Compare all of them on the best Figma plugins for developers.

For developers

Built this plugin?

Use this page as a landing page for SVG Converter: link to it from your site, README or launch posts, or add a badge. Pick a style and copy the code.

SVG Converter on figmaplugins.co

Style

Label

Size

Code

<a href="https://figmaplugins.co/plugins/svg-converter/" target="_blank" rel="noopener"><img src="https://figmaplugins.co/badges/featured-dark.svg" alt="SVG Converter on figmaplugins.co" width="220" height="48"></a>