How to use fa-light icons with React

Question

how do I use font-awesome light icons with React?

<FontAwesomeIcon icon={faEnvelope} size="2x" />

My code only work, if I use solid icon.

Thank you.

Answer 1

I know it doesn't help, but to use the light version in react, you only need a Pro account, as shown in the Pro section at this URL (https://fontawesome.com/docs/web/use-with/react/)

First you will have to download the dependency light npm i --save @fortawesome/pro-light-svg-icons but it is only for the Pro version, for the free versions you will have to use the font by the CDN in the html, or use a image.

After downloading just export the icon you want:

import React from 'react';
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import { faCircleInfo } from '@fortawesome/pro-light-svg-icons';

export default function Index(): JSX.Element {
    return (
        <FontAwesomeIcon icon={faCircleInfo} />
    );
}