# Toolbar

## Content

# Interface: Toolbar

Type representing a viewer's toolbar instance.

## Properties

### desktop

```ts
desktop: ToolbarItems;
```

Desktop layout toolbar items.

#### Example

```javascript
viewer.toolbar.desktop.addItem({
    key: 'coolButton',
    title: 'Cool Button',
    iconCssClass: 'mdi mdi-emoticon-cool',
    action: () => {
        console.log('Cool!');
    }}
)
```

***

### fullscreen

```ts
fullscreen: ToolbarItems;
```

Fullscreen mode toolbar items.

#### Example

```javascript
viewer.toolbar.fullscreen.addItem({
    key: 'fishButton',
    title: 'Fish',
    iconCssClass: 'mdi mdi-fish',
    action: () => {
        console.log('Just a fish.');
    }}
)
```

***

### mobile

```ts
mobile: ToolbarItems;
```

Mobile layout toolbar items.

#### Example

```javascript
viewer.toolbar.mobile.addItem({
    key: 'pizzaButton',
    title: 'Cool Pizza',
    iconCssClass: 'mdi mdi-pizza',
    action: () => {
        console.log('Pizza Time!');
    }}
)
```

***

### toggle

```ts
toggle: (show?) => void;
```

Toggles the toolbar visibility.

#### Parameters

##### show?

`boolean`

Pass **true** to switch toolbar ON, and vise-versa. Do not pass any value to toggle visibility.

#### Returns

`void`

#### Example

```javascript
viewer.toolbar.toggle(false); // hide toolbar
```