Are you going to use icons in your next project? Are you trying to find Font Awesome alternative? Phosphor come to the rescue!
Phosphor is a flexible icon family for interfaces, diagrams, presentations. It has over 9000 icons with 6 variants. So much icons that will take a lot of your time to choose.
For UI designer, Figma and Sketch plugin are available. If you are a Front-end developer, web, React, and Vue library are available. For mobile developer, Flutter and Swift library also available, a complete solutions for an icon library.
Now we talk about variants. Phosphor has 6 variants, there are Thin, Light, Regular, Bold, Fill, and Duotone. For some developers, maybe Regular and Fill version are more frequently used.
If you click one of the icon, a window will be sliding up, and you can view the code and simply copy to use it in your project. Download also available, you can choose between SVG or PNG, or just copy the SVG raw code, based on your needs.
Before using the code, you need to install the library that support your project. Let say you are working on a React project, you need to install the library first.
npm i @phosphor-icons/react
Then, you can use it like below,
import { Horse, Heart, Cube } from "@phosphor-icons/react";
const App = () => {
return (
<main>
<Horse />
<Heart color="#AE2983" weight="fill" size={32} />
<Cube color="teal" weight="duotone" />
</main>
);
};
For other framework, you can check in their Github.
If you can't find what icon you need, you can request an icon. Just post an icon request issue on their Github, and hopefully they answer your request.
So, in my opinion, Phosphor is a complete icon library solutions. As a Front-end and mobile developer, I highly recommend this for your next project.