react-fontawesome
react-fontawesome copied to clipboard
using font awesome icons in css background
hello
I am using react-fontawesome library like this in my components:
import {FontAwesomeIcon} from "@fortawesome/react-fontawesome"; import {faSearch} from "@fortawesome/free-solid-svg-icons";
but what if I want to use icons in css ? for example I have a input with search-input in background, how can I import faSearch icon in a css file and use it? thanks
Any luck with this?
Also looking for an answer on this. I'm having to import the FA stylesheet separately from the CDN right now which isn't ideal.
Use a bundler such as webpack, and use relative paths for the icons directly (pointing into ../node_modules/@fontawesome/...etc
), and then in your bundler use an importer that understands to turn css relative files into inline data:
urls.
The major downside to doing this is that they're now images and not inline svg - which means they're black on transparent, and short of using css filter: ...
you're unable to change that colour.