Download
Phosphor is a flexible icon family for interfaces, diagrams, presentations, whatever, really. We designed the icon library we always wanted to use. Easy to pick up and plug in. Truly consistent in style and scale. Flexible to multiple sizes and weights. Reserved enough to be multi-purpose, but a little quirky, too. Simply import the icons you need, and add them anywhere in your render method. Phosphor supports tree-shaking, so your bundle only includes code for the icons you use. Icon components accept all props that you can pass to a normal SVG element, including inline style objects, onClick handlers, and more. Phosphor takes advantage of React Context to make applying a default style to all icons simple. Create an IconContext.Provider at the root of the app (or anywhere above the icons in the tree) and pass in a configuration object with props to be applied by default to all icons.
Features
- Icon stroke/fill color
- Can be any CSS color string
- You may create multiple Contexts for styling icons differently in separate regions of an application
- Components can accept arbitrary SVG elements as children, so long as they are valid children of the <svg> element
- You may wish to import all icons at once for use in your project
- Phosphor is a flexible icon family for interfaces
Project Samples
