Icon
Chakra provides a set of commonly used interface icons you can use in your project
Props#
Icon props#
| Name | Type | Default | Description | 
|---|---|---|---|
viewBox | string | 0 0 24 24 | The viewBox of the icon. | 
boxSize | string | 1em | The size (width and height) of the icon. | 
color | string | currentColor | The color of the icon. | 
focusable | boolean | false | Denotes that the icon is not an interactive element, and only used for presentation. | 
role | presentation, img | The html role of the icon. | |
children | React.ReactNode | The Path or Group of the icon | 
createIcon options#
Props#
Icon props#
| Name | Type | Default | Description | 
|---|---|---|---|
viewBox | string | 0 0 24 24 | The viewBox of the icon. | 
boxSize | string | 1em | The size (width and height) of the icon. | 
color | string | currentColor | The color of the icon. | 
focusable | boolean | false | Denotes that the icon is not an interactive element, and only used for presentation. | 
role | presentation, img | The html role of the icon. | |
children | React.ReactNode | The Path or Group of the icon |