Menu
Basically I'm trying to use two icons:
<i class="fas fa-heart"></i> Solid heart icon
<i class="far fa-heart"></i> Regular heart icon (outlined)
The first one I got with the following code:
<FontAwesomeIcon icon={faHeart} />
How can I get the second one?
638
To increase fa-border-all font awesome icon size, use the fa-lg (33% increase), fa-2x, fa-3x, fa-4x, or fa-5x classes along with icon class fa-border-all.
To use font awesome icons in easy way into your React project use react-icon library which not only provides support for font awesome but as well as provides for Bootstrap icons , Heroicons and more. step 2. Import a icon like this - Step 3. Use it something like this -
To use FontAwesome in React Native you need to download the fonts as a TTF file and have to include in your project the same as I have described below. We are going to use Regular, Solid, and Brand Icons in this example so please click on the below URL to download TTF file for the same.
Font Awesome's import code is import { IconName } from "react-icons/fa";. Follow these steps below to use the Font Awesome icons in your app. In App.js, paste the import code at the top of the file after the React import code Go back to the React icons page and choose any icon from the Font Awesome icons
There are a few ways to add icons when using React. The easiest way is to use Dynamic Icon Importing which automatically imports the icons you're using - and only the icons you're using. But you can choose other methods that allow you to explicitly add individual icons or add icons to a global library.
After some reading in the react-fontawesome docs I figured out how to do outlined icons.
For the first one I need the package @fortawesome/free-solid-svg-icons
Then I need to import the icons as the following:
import { faHeart, faTrash } from '@fortawesome/free-solid-svg-icons'
The second one, I need the package @fortawesome/free-regular-svg-icons
Then I just import the following.
import { faHeart as farHeart } from '@fortawesome/free-regular-svg-icons'
That's it!
115
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
