# Icon

The Toolkit plugin has a small set of icons available for usage

![Feather Icons](https://2573846121-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-M4poMvugQiWii-2eM1T%2F-MT35uzK31fgItJhMHNH%2F-MT36c21ieBLso39NFnx%2Ficons.png?alt=media\&token=0250eb34-a06f-46de-a435-1071080fae7f)

## Usage

{% code title="/MyElement.js" %}

```jsx
import React from 'react';
import { useHookComponent } from 'reactium-core/sdk';

 const MyElement = () => {
   const { Icon, Element } = useHookComponent('RTK'); 
   
   return (
     <Element title='My Element'>
       <Icon name='Feather.AlertCircle' />
     </Element>
   );
 }; 
```

{% endcode %}

## Properties

| Property | Type     | Description                                                                   |
| -------- | -------- | ----------------------------------------------------------------------------- |
| **name** | `String` | The icon name                                                                 |
| **size** | `Number` | <p>The size of the icon. </p><p><strong><code>Default: 24</code></strong></p> |

{% hint style="info" %}
Any additional props are passed to the SVG element.&#x20;
{% endhint %}

## Icons

```javascript
[
  "Feather.AlertCircle",
  "Feather.AlertOctagon",
  "Feather.AlertTriangle",
  "Feather.ArrowDown",
  "Feather.ArrowDownCircle",
  "Feather.ArrowDownLeft",
  "Feather.ArrowDownRight",
  "Feather.ArrowLeft",
  "Feather.ArrowLeftCircle",
  "Feather.ArrowRight",
  "Feather.ArrowRightCircle",
  "Feather.ArrowUp",
  "Feather.ArrowUpCircle",
  "Feather.ArrowUpLeft",
  "Feather.ArrowUpRight",
  "Feather.Box",
  "Feather.Check",
  "Feather.ChevronDown",
  "Feather.ChevronLeft",
  "Feather.ChevronRight",
  "Feather.ChevronUp",
  "Feather.Clipboard",
  "Feather.Code",
  "Feather.Copy",
  "Feather.Cpu",
  "Feather.ExternalLink",
  "Feather.Feather",
  "Feather.File",
  "Feather.Filter",
  "Feather.Folder",
  "Feather.Heart",
  "Feather.HelpCircle",
  "Feather.Info",
  "Feather.Layout",
  "Feather.List",
  "Feather.Maximize",
  "Feather.Menu",
  "Feather.Minimize",
  "Feather.Minus",
  "Feather.MinusCircle",
  "Feather.MinusSquare",
  "Feather.Monitor",
  "Feather.MoreHorizontal",
  "Feather.MoreVertical",
  "Feather.Package",
  "Feather.Plus",
  "Feather.PlusCircle",
  "Feather.PlusSquare",
  "Feather.RefreshCw",
  "Feather.Settings",
  "Feather.Sidebar",
  "Feather.Sliders",
  "Feather.Tag",
  "Feather.X",
  "Feather.XCircle",
  "Feather.XOctagon",
  "Feather.XSquare"
]

```