Official React.js component for CoreUI Icons and CoreUI Icons PRO.
Explore CoreUI Icons for React docs »
Report bug
·
Request feature
·
Blog
## Status
[![npm package][npm-badge]][npm]
[![NPM downloads][npm-download]][npm]
[npm-badge]: https://img.shields.io/npm/v/@coreui/icons-react/latest?style=flat-square
[npm]: https://www.npmjs.com/package/@coreui/icons-react
[npm-download]: https://img.shields.io/npm/dm/@coreui/icons-react.svg?style=flat-square
## Installation
```bash
npm install @coreui/icons
npm install @coreui/icons-react
```
or
```bash
yarn add @coreui/icons
yarn add @coreui/icons-react
```
## Use
### Single icon
```jsx
import { CIcon } from '@coreui/icons-react';
import { cifAU } from '@coreui/icons';
...
render() {
return (
)
}
...
```
### All icons
```jsx
import { CIcon } from '@coreui/icons-react';
import * as icon from '@coreui/icons';
...
render() {
return (
)
}
...
```
## API
| property | type | description |
| --- | --- | --- |
| className | `string` | A string of all className you want applied to the component. |
| customClassName | `string` \| `object` \| `string[]` | Use for replacing default CIcon component classes. Prop is overriding the 'size' prop. |
| icon | `string` \| `string[]` | Name of the icon placed in React object or SVG content. |
| height | `number` | The height attribute defines the vertical length of an icon. |
| size | `sm` \| `md` \|`lg` \| `xl` \| `xxl` \| `3xl` \| `4xl` \| `5xl` \| `6xl` \| `7xl` \| `8xl` \| `9xl` | Size of the icon. |
| use | `string` | If defined component will be rendered using `use` tag. |
| title | `string` | Title tag content. |
| width | `number` | The width attribute defines the horizontal length of an icon. |