> For the complete documentation index, see [llms.txt](https://docs.navigaglobal.com/writer/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.navigaglobal.com/writer/6.2.1/api-reference/uicomponents/uiiconbutton.md).

# UIIconButton

Create a simple button, or a button with a context menu button component.

## Properties

| Name     | Type       | Default     | Description                                                                            |
| -------- | ---------- | ----------- | -------------------------------------------------------------------------------------- |
| icon     | `string`   |             | **Required** - Font awesome class to use as an inline icon prefixed to the button text |
| disabled | `boolean`  | `false`     | Set to true to disable button                                                          |
| size     | `string`   | `"default"` | Size of button. Variants: large\|small                                                 |
| onClick  | `function` |             | Callback for when the button is clicked                                                |

## Example

```javascript
import {UIIconButton} from 'writer'

render($$) {
    const el = $$('div')

    return el.append(
        $$(UIIconButton, {
            icon: 'pencil',
            onClick: () => {
                // Do something
            }
        })
    )
}
```

## Example

```javascript
import {UIIconButton} from 'writer'

render($$) {
    const el = $$('div')

    return el.append(
        $$(UIIconButton, {
            icon: 'bug',
            size: 'small',
            onClick: () => {
                // Do something
            }
        })
    )
}
```