@solar-icons/react-perf

The @solar-icons/react-perf package provides a highly optimized, performance-focused library of React components for the Solar icon set. This package is tailored for developers who prioritize reduced bundle sizes and efficient rendering by focusing on single-style imports and simplified SVG structures.

Installation

Install the package using npm or yarn:

``bash
npm install @solar-icons/react-perf
`

or

`bash
yarn add @solar-icons/react-perf
`

Usage

$3

Import icons from the package:

`jsx
import { AltArrowLeft, CheckCircle } from '@solar-icons/react-perf/Linear'

function App() {
return (



)
}
`

$3

`jsx
import { AltArrowLeft, ArrowUp } from '@solar-icons/react-perf/category/arrows/Linear'
import { Cart, Bag } from '@solar-icons/react-perf/category/shopping/Bold'
`

Key Features

- Performance-Oriented: Each icon is packaged individually, ensuring that only the required assets are included in the final bundle.
- Single-Style Icons: Icons are separated by style (e.g., Bold, Linear), enabling more precise imports.
- Lightweight SVGs: Each icon is optimized for minimal SVG size to reduce load times.

$3

Each icon component supports the following properties:

- size: Defines the size of the icon (e.g., 24, "1.5em").
- color: Sets the color of the icon (e.g., "#000", "currentColor").
- mirrored: Flips the icon horizontally when set to true.

Advanced Usage

$3

Customize icons using standard React properties or additional CSS classes:

`jsx
import { ArrowUpBold } from '@solar-icons/react-perf'

function CustomIcon() {
return
}
`

Performance Benefits

Unlike the versatile @solar-icons/react package, @solar-icons/react-perf focuses solely on direct imports for enhanced performance and reduced overhead. This package avoids using a provider or dual SSR/CSR support to ensure lightweight integration.

Contributing

Contributions to further optimize and expand the @solar-icons/react-perf package are welcome. If you wish to contribute, please follow our contribution guidelines.

License

The @solar-icons/react-perf` code and library are licensed under the MIT License. The Solar icon pack itself is licensed under CC BY 4.0 by 480 Design, which requires attribution for any use. For more information and to view the original icon set, visit 480 Design's Figma page.

Acknowledgements

Special thanks to 480 Design for creating the original Solar icon pack. Additional appreciation goes to Phosphor Icons and Lucide Icons for their inspiration in shaping the design and approach of the Solar icon packages.

---

For more details on other packages and usage examples, refer to the project's main documentation.