Vue Icon Component API

Icon API

Explore the API reference for the Vue Icon component and discover how to effectively utilize its props for customization.

On this page

jsx

import { CIcon } from '@coreui/vue'

Property	Default	Type
contentDeprecated since version 3.0	`undefined`	`string`, `array`
Use `:icon="..."` instead of
customClassName	`undefined`	`string`, `array`, `object`
Use for replacing default CIcon component classes. Prop is overriding the 'size' prop.
icon	`undefined`	`string`, `string[]`
Name of the icon placed in React object or SVG content.
nameDeprecated since version 3.0	`undefined`	`string`
Use `icon="..."` instead of
size	`undefined`	`string`
Size of the icon. Available sizes: 'sm', 'lg', 'xl', 'xxl', '3xl...9xl', 'custom', 'custom-size'.
title	`undefined`	`string`
Title tag content.
use	`undefined`	`string`
If defined component will be rendered using 'use' tag.

jsx

import { CIconSvg } from '@coreui/vue'

Property	Default	Type
customClassName	-	`string`, `array`, `object`
Use for replacing default CIconSvg component classes. Prop is overriding the 'size' prop.
height	-	`number`
The height attribute defines the vertical length of an icon.
size	-	`string`
Size of the icon. Available sizes: 'sm', 'lg', 'xl', 'xxl', '3xl...9xl', 'custom', 'custom-size'.
title	-	`string`
Title tag content.
width	-	`number`
The width attribute defines the horizontal length of an icon.