Figma plugin#19 in Developers

SVG Converter

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

by Mit Fleg

users
40K
likes
126
saves
3.2K
comments
6
FreeWorks inFigma DesignFigJam
Price
Free
Latest version
v6 · Jun 11, 2023
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 40,029 users and 126 likes on the Figma Community. It ranks #19 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 6 · released Jun 11, 2023

  • Completely redesigned interface.
  • Script performance has been improved.
  • Various subscription options have been added (1 Day, 1 Week, 1 Month, 1 Year).
  • The login system has been simplified. Now there is no need to remember a large number of passwords, just enter your email.
Trust

Permissions and privacy

Network access

This plugin's manifest doesn't declare its network access, which is common for older plugins. Figma shows a warning on the Community page for plugins like this.

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. 369K users7.6KFree + paid features

    The scalable design tokens solution for Figma

  2. 2

    Zeplin

    by Zeplin Crew

    293K users2.9KFree + paid features

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

  3. 3

    DesignDoc [Spectral]

    by Marka Plugin Dev

    141K users3.2KFree

    📐 Effortlessly hand off your Figma designs to the development team

  4. 4

    Inspect Styles

    by max.denaro

    139K users4KFree

    Inspect styles from Figma and transform to CSS

  5. 5

    Figma Exporter

    by JerryKhw

    117K users516Free

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

  6. 112K users3.7KFree

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

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.

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 Tokens Studio for Figma, Zeplin and [DesignDoc [Spectral]](/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>

Want it featured on figmaplugins.co? Submit it for review