> ## Documentation Index
> Fetch the complete documentation index at: https://help.dingtalk.io/llms.txt
> Use this file to discover all available pages before exploring further.

# Komponen Icon

> Pelajari cara menggunakan komponen Icon di YiDA untuk menambahkan penanda visual yang intuitif — pilih dari ikon bawaan atau unggah ikon kustom dari Iconfont, lalu atur ukurannya sesuai kebutuhan desain halaman Anda.

Menampilkan ikon. Pengguna dapat memakai ikon bawaan YiDA dan mengatur ukurannya.

## Kapan menggunakan

Menampilkan penanda melalui ikon, misalnya peringatan, tips, tren, dan sebagainya.

## Contoh komponen

## Penggunaan ikon kustom

### 1. Buka <a href="https://www.iconfont.cn/">iconfont</a>

### 2. Tambahkan ikon favorit Anda ke keranjang belanja. Setelah ditambahkan, buka keranjang belanja dan tambahkan ikon ke proyek baru (disarankan membuat proyek baru)

### 3. Pilih Symbol, lihat tautan online, lalu salin kode ke YiDA. Contoh:

```
 //at.alicdn.com/t/font_3429645_pimqzpqqzps.js
```

### 4. Salin nama ikon ke YiDA. Contoh:

```
 icon-liebiao
```

## Properti komponen

| Atribut     | Deskripsi                                                                                                | Tipe                                                                        | Default    |
| ----------- | -------------------------------------------------------------------------------------------------------- | --------------------------------------------------------------------------- | ---------- |
| `baseType`  | Ikon dasar; hanya sesuai dengan teks di bawah icon pada contoh di atas                                   | `string`                                                                    | `'smile'`  |
| `otherType` | Ikon kustom                                                                                              | `string`                                                                    | `'smile'`  |
| `size`      | Ukuran ikon                                                                                              | `'xxs' \| 'xs' \| 'small' \| 'medium' \| 'large' \| 'xl' \|'xxl' \| 'xxxl'` | `'medium'` |
| `useType`   | Tipe penggunaan ikon. Jika true, atribut **otherType** berlaku; jika false, atribut **baseType** berlaku | `boolean`                                                                   | `false`    |