SVG react-icons position and scaling problems on card

transform: scale() was not working properly. Solved this way:

import { IconContext } from 'react-icons';

import { FaPenNib, FaPencilRuler } from 'react-icons/fa';

<IconContext.Provider

            value={{

              color: 'grey',

              size: '10rem',

              className: 'svg-class',

            }}

          >

            <div>

                  <FaPenNib />

            </div>

</IconContext.Provider>

https://github.com/react-icons/react-icons

Key	Default	Notes
color	undefined (inherit)
size	1em
className	undefined
style	undefined	Can overwrite size and color
attr	undefined	Overwritten by other attributes
title	undefined	Icon description for accessibility