https://github.com/zamarrowski/react-ionicons
A React Ionicon component https://react-ionicons.netlify.app/
https://github.com/zamarrowski/react-ionicons
icons ionicons react react-icons react-ionicons
Last synced: 18 days ago
JSON representation
A React Ionicon component https://react-ionicons.netlify.app/
- Host: GitHub
- URL: https://github.com/zamarrowski/react-ionicons
- Owner: zamarrowski
- License: apache-2.0
- Created: 2017-03-02T15:02:56.000Z (almost 9 years ago)
- Default Branch: master
- Last Pushed: 2023-07-14T00:09:32.000Z (over 2 years ago)
- Last Synced: 2023-11-07T17:15:52.582Z (about 2 years ago)
- Topics: icons, ionicons, react, react-icons, react-ionicons
- Language: JavaScript
- Homepage:
- Size: 13 MB
- Stars: 191
- Watchers: 3
- Forks: 28
- Open Issues: 12
-
Metadata Files:
- Readme: README.MD
- License: LICENSE
Awesome Lists containing this project
README
# A React Ionicon Component
Beautiful doc in https://react-ionicons.netlify.app/
## Install
```sh
$ npm install --save react-ionicons
```
or
```sh
$ yarn add react-ionicons
```
## Usage
```js
import React from 'react'
import { render } from 'react-dom'
import { LogoNodejs } from 'react-ionicons'
alert('Hi!')}
/>
```
### Browserify
[`browserify`](https://npmjs.com/packages/browserify) is supported, but you have to install [`browserify-css@^0.12.0`](https://npmjs.com/packages/browserify-css) manually.
## Features
* SVG Icons.
* Simple API.
* Animations.
* Customizable.
* Support to Create React App.
* Typescript support.
## API:
| Param | Type | Description | Example |
| --- | --- | --- | --- |
| `height` | `String` | Icon size. Allow all units (px, em, %, pt...). | `height="22px"` |
| `width` | `String` | Icon size. Allow all units (px, em, %, pt...). | `width="22px"` |
| `color` | `String` | Icon color. Allow string (blue, red, cyan...), rgb, rgba and hexadecimal colors. | `color="#C9C9C9"` |
| `title` | `String` | Tooltip for the icon | `title="this is a tooltip"` |
| `cssClasses` | `String` | Pass a string with cssClasses | `cssClasses="myButton"` |
| `rotate` | `Boolean` | Apply rotate animation to icon | `rotate={true}` |
| `shake` | `Boolean` | Apply shake animation to icon | `shake={true}` |
| `beat` | `Boolean` | Apply beat animation to icon | `beat={true}` |
| `onClick` | `Function` | Pass a function to execute onClick | `onClick={() => console.log('Hi!')}` |
| `style` | `Object` | Pass a style object | `style={{ verticalAlign: 'middle' }}` |