CODEWITHSUNDEEP
reactjsprimereactreact-icons
user17145524
user17145524

Reputation: 291

PrimeReact in combination with react-icons

I was wondering if it is somehow possible to use the icons from the react-icons package in PrimeReact, since the primeIcons package unfortunately does not contain all the icons I need for my project.

I haven't found a solution for this, because react-icons exports the icons as components and PrimeReact gets the icons assigned by string.

Upvotes: 3

Views: 1430

Answers (2)

SelimSezer
SelimSezer

Reputation: 39

This is a example

import { FaWheelchair, FaBolt, FaCarAlt, FaCar } from "react-icons/fa";

...

return( 
<div className="flex card-container overflow-hidden ">
              <div className="flex-none flex align-items-center justify-content-center  p-1">
                            <TfiWheelchair />
                            <p className="text-lg">Wheelchair</p>
                        </div>
                    </div>);

Upvotes: 1

Laxman
Laxman

Reputation: 2690

To change say search icon in a button

you can access https://react-icons.github.io/react-icons/search?q=fasearch

right click on the icon and inspect the elements, copy the SVG for the same from the developer console
create say search.svg file and paste the svg for fasearch in the file add below class in say root.css file

.pi-search:before {
  content: url(search.svg) !important;
}

This will change the search icon

Upvotes: 3

Related Questions