Skip to content
IcoMoon for ReactJS
JavaScript
Branch: master
Clone or download
Latest commit e60a4c2 Dec 7, 2019
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
dist viewBox height problem solved. Dec 4, 2019
src viewBox height problem solved. Dec 4, 2019
.babelrc Babel minify preset added. Dec 2, 2019
.gitignore .gitinore and .npmignore update Jan 14, 2019
.npmignore .gitinore and .npmignore update Jan 14, 2019
LICENCE Apache 2.0 Licence added. Jan 14, 2019
logo.png Readme update. Dec 4, 2019
package.json 2.0.3 Dec 4, 2019
readme.md Readme typo fixed. Dec 7, 2019
yarn.lock Babel minify preset added. Dec 2, 2019

readme.md

React-IcoMoon

License

React-Icomoon Logo

Size < 2kb and 0 Dependencies

With React-Icomoon you can easily use the icons you have selected or created in icomoon.

Demo

Install

npm install react-icomoon

Usage

You can use the icons you selected on IcoMoon by downloading the selection.json file.

https://icomoon.io/app/

Declare

// icon.js
import React from "react";
import IcoMoon from "react-icomoon";
const iconSet = require("./selection.json");

const Icon = ({ ...props }) => {
  return <IcoMoon iconSet={iconSet} {...props} />;
};

export default Icon;

Use

import Icon from "./icon";

<Icon icon="focus" />

Props List

Name Type Default Sample
iconSet Object undefined "selection.json file content"
icon String undefined "home"
size Number,String undefined "1em", 10, "100px"
color String undefined "red", "#f00", "rgb(0,0,0)"
style Object {...} { color: '#ff0'}
className String undefined "icomoon"
disableFill Boolean undefined true
removeInlineStyle Boolean undefined true

Default Style

{
  display: "inline-block",
  stroke: "currentColor",
  fill: "currentColor",
}
You can’t perform that action at this time.