SVG to JSX - Convert SVG to React valid SVG(svg2jsx.herokuapp.com)

6 years ago from Raul Dronca, Designer

  • Simon EvansSimon Evans, 6 years ago

    JSX doesn't support conventional tag naming.

    For example, you may have an SVG that contains:

    <path class='class-1' data-name='name-1' d='M-100'/>

    JSX wouldn't be able to parse this correctly.

    Instead, the correct JSX would be something like:

    <path className="class-1' dataName='name-1' d='M-100'/>

    (class becomes className and data-name becomes dataName)

    These are just simple examples, but in a large SVG this can be tedious.

    Great tool!

    2 points