Fontawesome icons React

user_15971108 0
Viewed 82

How can i add an icon like this (i added from a tutorial from this forum):

fonteawesome facebook icon

in React? Because i added this like this:

import { library } from '@fortawesome/fontawesome-svg-core'
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
import { faFacebookF } from '@fortawesome/free-brands-svg-icons' 


<FontAwesomeIcon icon={['fab', 'facebook-f']} className="fb-icon-style" />


library.add(faFacebookF);

---- And that's it! But now how can i add icons like this: https://fontawesome.com/icons/globe or this https://fontawesome.com/icons/youtube ?

Thanks a lot!

reactjs icons windows
2 Answers

Below code will work

Solution

import { faFacebookF, faYoutube } from '@fortawesome/free-brands-svg-icons';
import { faGlobe } from '@fortawesome/free-solid-svg-icons'; 


<FontAwesomeIcon icon={faYoutube} />
<FontAwesomeIcon icon={faFacebookF} />
<FontAwesomeIcon icon={faGlobe} />

Note: Install @fortawesome/free-solid-svg-icons if not installed already

user_59390580

You do it like this:

import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
import { faFacebookF } from "@fortawesome/free-brands-svg-icons"


function App() {
  return (
    <div className="App">
      <FontAwesomeIcon icon={faFacebookF} />

    </div>
  );
}

export default App;

Make sure you import relevant npm packages:

npm install --save @fortawesome/react-fontawesome
npm i --save @fortawesome/free-brands-svg-icons
Admin1
Related