how to scale (large) font-awesome icons from the react-icons package how to scale (large) font-awesome icons from the react-icons package reactjs reactjs

how to scale (large) font-awesome icons from the react-icons package


if you want a 5x icon size you need to pass it to the react class as size

// Font awesome pixel sizes relative to the multiplier. // 1x - 14px// 2x - 28px// 3x - 42px// 4x - 56px// 5x - 70px<FaFolderOpen size={70} />

if you notice it jumps by 14 each time

from the github readme it shows everything is overridden inline. its rendering a svg so you cant use 5x you have to use a pixel size


In reactjs you can use size = 'with your preferred size which be from sm to lg or 1x to 10x'

this is example for font awesome 5 in react

<FontAwesomeIcon icon={faBars} size = '10x'/>


If you need to style several icons simultaneously, you can wrap them to IconContext.Provider.

<IconContext.Provider value={{color: 'navy', size: 42}}>   <FaFacebook />   <FaGithub />   <FaLinkedin /></IconContext.Provider>