SVG to React (JSX) Converter

Instantly convert raw SVG HTML code into perfectly formatted React Functional Components.
It automatically fixes camelCase attributes (like stroke-width to strokeWidth) and replaces class with className.

Component Name:

Raw SVG Input

React JSX Output

const Icon = (props) => {
  return (
    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" className="lucide lucide-code">
      <polyline points="16 18 22 12 16 6"></polyline>
      <polyline points="8 6 2 12 8 18"></polyline>
    </svg>
  );
};

export default Icon;

All Tools Directory (162 Apps)

SVG to React (JSX) Converter