# Icon

## Overview

An icon image. The component supports different alignment options, sizes, as well as the *Auto size* option.

<figure><img src="https://837703843-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FUX6zPRMFFK0yrTghj7cY%2Fuploads%2Fkscmz3yunICCg9tcssgY%2FCleanShot%202025-08-04%20at%2014.04.32%402x-min.png?alt=media&#x26;token=0140c1bc-2251-4c71-8780-341cb9924bed" alt=""><figcaption></figcaption></figure>

{% hint style="success" %}
We support the icons from our icons collection as well as Material icons.
{% endhint %}

### Properties

| Name   | Type     | Description    |
| ------ | -------- | -------------- |
| `name` | `string` | Component name |

### Methods

<table><thead><tr><th width="99.9453125">Name</th><th width="133.54296875">Parameters</th><th width="104.87109375">Returns</th><th>Description</th></tr></thead><tbody><tr><td><code>setIcon</code></td><td><code>icon: string</code></td><td><code>void</code></td><td>Set component icon setting</td></tr></tbody></table>

### Triggers

<table><thead><tr><th width="138.19140625">Name</th><th>Description</th></tr></thead><tbody><tr><td><strong>On Click</strong></td><td>Triggered when the component is clicked</td></tr><tr><td><strong>On Init</strong></td><td>Triggered when the component is initialized</td></tr></tbody></table>