CoreUI is an MIT-licensed open source project and is completely free to use. However, the amount of effort needed to maintain and develop new features for the project is not sustainable without proper financial backing.
You can support our Open Source software development in the following ways:
React icons is a great resource for React developers, who can use its customizable SVG icons in their applications. It offers an extensive library of icons to choose from, which can be easily inserted into projects with just a few lines of code. Not only that, but users are also able to customize the appearance of these icons by setting various props on them. This provides developers with an efficient and flexible way to integrate useful graphical elements into their webpages without doing any extra work.
To use React icons in your project, you will need to install it as a dependency:
1// CoreUI Icons library2npm install @coreui/icons34// CIcon component5npm install @coreui/icons-react
1yarn add @coreui/icons2yarn add @coreui/icons-react
1import { CIcon } from '@coreui/icons-react';2import { cilList, cilShieldAlt } from '@coreui/icons';34...5<CIcon icon={cilList} size="xl"/>6<CIcon icon={cilShieldAlt} size="xl"/>7...
1import CIcon from '@coreui/icons-react';2import * as icon from '@coreui/icons';34...5render() {6 return (7 <CIcon icon={icon.cilList} size="xxl"/>8 )9}10...
CoreUI React Icons package is delivered with more than 1500 icons in multiple formats SVG, PNG, and Webfonts. CoreUI Icons are beautifully crafted symbols for common actions and items. You can use them in your digital products for web or mobile app.
React Icons also provides a variety of customization options, such as the ability to change the size, color, and style of the icons, as well as the ability to add additional CSS classes to the icons. You can find more information on these customization options in the documentation.
1import { CIcon } from '@coreui/icons-react'2// or3import CIcon from '@coreui/icons-react/src/CIcon'
Property | Description | Type | Default |
---|---|---|---|
className | A string of all className you want applied to the component. | string | - |
content Deprecated 3.0+ | Use icon={...} instead of | string | string[] | - |
customClassName | Use for replacing default CIcon component classes. Prop is overriding the 'size' prop. | string | object | string[] | - |
height | The height attribute defines the vertical length of an icon. | number | - |
icon | Name of the icon placed in React object or SVG content. | string | string[] | - |
name Deprecated 3.0+ | Use icon="..." instead of | string | - |
size | Size of the icon. Available sizes: 'sm', 'lg', 'xl', 'xxl', '3xl...9xl', 'custom', 'custom-size'. | 'custom' | 'custom-size' | 'sm' | 'lg' | 'xl' | 'xxl' | '3xl' | '4xl' | '5xl' | '6xl' | '7xl' | '8xl' | '9xl' | - |
title | Title tag content. | string | - |
use | If defined component will be rendered using 'use' tag. | string | - |
width | The width attribute defines the horizontal length of an icon. | number | - |