> For the complete documentation index, see [llms.txt](https://docs.astrolescent.com/astrolescent-docs/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.astrolescent.com/astrolescent-docs/infrastructure/swap-widget.md).

# Swap Widget

We offer an easy-to-integrate swap widget that allows Astrolescent to be integrated directly into your website.

You can add our swap widget by simply adding the following code to your website:

```html
<iframe 
    src="https://astrolescent.com/widget" 
    width="467px" height="750px" frameborder="0">
</iframe>    
```

#### Setting defaults

The swap widget supports setting a selling and buying token and a default amount by adding it to the URL.

* `from`: the resource address the widget is selling
* `to`: the resource address the widget is buying
* `amount`: the amount of tokens that will be sold
* `feeComponent`:  address of your fee component address
* `fee`: the fee you'd like to charge, `0.01` = 1%, `0.003` is 0.3%

To set up your own fee component, reach out to use on Telegram and we'll help you set it up.

For example, HUG uses the following settings:

```html
<iframe 
    src="https://astrolescent.com/widget?to=resource_rdx1t5kmyj54jt85malva7fxdrnpvgfgs623yt7ywdaval25vrdlmnwe97&amount=100" 
    width="467px" height="750px" frameborder="0">
</iframe>
```

Where `to` is set to HUG's token address *resource\_rdx1t5kmyj54jt85malva7fxdrnpvgfgs623yt7ywdaval25vrdlmnwe97,* and the `amount` to *100*, letting the widget display a trade of selling 100 XRD for HUG.

<figure><img src="/files/S2uzT8N8ZgtyaBJ7RHWw" alt="" width="375"><figcaption><p>Example of the swap widget on a white background.</p></figcaption></figure>