Iconic

About this plugin

Features

1. Export SVG icons as fully typed React components
2. Convert SVG attributes to JSX-compatible format (camelCase)
3. Export multiple icons at once in a convenient ZIP file
4. Maintain proper viewBox attributes and other SVG properties
5. Components accept all standard SVG props plus custom ones
6. SVG optimization to reduce file size and improve performance

Usage Instructions

1. Select one or more SVG elements in your Figma document that you want to export as React components.
2. Open the plugin from the Figma plugins menu or using the Quick Actions search bar.
3. Export: Click the "Export" button in the plugin UI.
4. When the export is complete, your browser will prompt you to save the "react-icons.zip" file.

The plugin will:

1. Convert each selected SVG to a React component
2. Optimize SVGs by removing unnecessary elements and attributes
3. Format the SVG markup for JSX compatibility
4. Package all components into a ZIP file

Open and Use:

1. Unzip the downloaded file into your project's components directory.
2. Import the components in your React code.