PhosphorPhosphor Icons
You might say
I want icons with adjustable stroke weight and a unified look — one library isn't enough.
Phosphor is an open icon system built around weight: every icon ships in Thin / Light / Regular / Bold / Fill / Duotone.·Maintained by the Phosphor team (MIT, 1,000+ icons). Its signature is continuously adjustable weight, which suits interfaces that need hierarchy and brand polish; the Duotone mode layers foreground and background colors for depth. In React: npm i @phosphor-icons/react, then import { House } from "@phosphor-icons/react" and control weight with <House weight="bold" />.
Also calledPhosphormulti-weight iconsDuotoneSVG icons
house
magnifying-glass
gear
user
heart
star
bell
envelope-simple
camera
chat-circle
trash
plus
arrow-right
check
x
lightbulb
shopping-cart
calendar
Typical use cases
Brand / product sitesMultiple weights keep headings (bold) and body icons (light) in one family, reinforcing brand consistency.
Marketing / illustrated UIDuotone's built-in layering suits cards, empty states and onboarding illustrations.
Design systems / component librariesSix weights cover hover / active / disabled states without extra cut assets.
Light & dark / cross-platformVector + currentColor makes theme switching free and stays crisp on mobile.
Further reading