Include pixel perfect icons in your React projects easily with rebel-icons
.
Use ES6 imports and include only the icons that your project is using.
Use React Higher Order
component to adjust your icons defaults.
Override an attribute if needed and even more... with Rebel Icons
.
This library designed to be used with React
, you don't need any other packages to use this icons.
We distribute this package as npm
package. In order to use it you just need to install it as
any other project in your system.
npm install rebel-icons --save
You can easily add rebel-icons
to any Component in you app, just import it, and you good to go.
import Icon from 'rebel-icons';
class OneAwesomeComponent extends Component {
render() {
return <h3> Lets do some <Icon icon="RubyIcon" /></h3>
}
}
All components use IconBase
, so you can use Context
to provide some defaults to your project.
Your can use one of your root component to set this configuration.
export default class RootComponent extends Component {
static childContextTypes = {
rebelIconsBase: PropTypes.object
};
getChildContext() {
return {
rebelIconsBase: {
color: 'grey',
size: 64,
style: {
...
}
}
}
}
...
}
If you want to reduce the size of your bundle and you are using webpack you can use ContextReplacementPlugin to specify the list of Rebel Icons that you want to use.
// Webpack_config.js
const Icons = ['rebel', 'js', 'ruby', ...];
const regExp = new RegExp(`(?:${Icons.join('|')})Icon`, 'i');
plugins: [
...
new webpack.ContextReplacementPlugin(/rebel-icons[\/\\]rebel-lib$/, regExp)
]
If you have questions, concerns, bug reports, etc, please file an issue in this repository's Issue Tracker. We appreciate all feedback and will be glad to help if we can.
- Fork it!
- Create your feature branch: git checkout -b my-new-feature
- Commit your changes: git commit -am 'Add some feature'
- Push to the branch: git push origin my-new-feature
- Submit a pull request :D
General instructions on how to contribute can be found here CONTRIBUTING.
Alla Odeyanenko | Anton Shemerey | Aleksandr Zhukov |
---|---|---|
https://www.linkedin.com/in/alla-odeyanenko |
https://github.com/shemerey |
https://github.com/AleksandrZhukov |
This project released under MIT LICENSE
- Where is the font?
Rebel Icons
doesn’t come as a font we are targetReact
only. - Is
Rebel Icons
free even for commercial use? Yes, absolutely.