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

# Sizing

> Configure the widget's default size and enable user resizing

Control the widget panel's dimensions and let your users resize it to their preference.

## Default size

Set `size.width` and `size.height` to any CSS value — `px`, `%`, `vw`/`vh`, `rem`, etc.:

```javascript theme={null}
const voltai = Voltai.load({
  apiKey: 'your-api-key',
  size: {
    width: '500px',
    height: '80vh'
  }
});
```

If omitted, the widget defaults to `85vw` wide and `92vh` tall.

## Resizable by users

Enable `resizable` to let users drag the top edge, left edge, or top-left corner to resize the panel. Their preferred size is saved to `localStorage` and restored on page refresh.

Double-clicking a resize handle resets to the default size.

```javascript theme={null}
const voltai = Voltai.load({
  apiKey: 'your-api-key',
  size: {
    resizable: true
  }
});
```

## Resize constraints

Set minimum and maximum dimensions (in pixels) for resizing:

```javascript theme={null}
const voltai = Voltai.load({
  apiKey: 'your-api-key',
  size: {
    width: '600px',
    height: '80vh',
    minWidth: 400,
    minHeight: 500,
    maxWidth: 1200,
    maxHeight: 900
  }
});
```

## Available options

| Property    | Type      | Default       | Description                        |
| ----------- | --------- | ------------- | ---------------------------------- |
| `width`     | `string`  | `"85vw"`      | Default width (any CSS value)      |
| `height`    | `string`  | `"92vh"`      | Default height (any CSS value)     |
| `minWidth`  | `number`  | `320`         | Minimum width in px when resizing  |
| `minHeight` | `number`  | `400`         | Minimum height in px when resizing |
| `maxWidth`  | `number`  | viewport - 32 | Maximum width in px when resizing  |
| `maxHeight` | `number`  | viewport - 32 | Maximum height in px when resizing |
| `resizable` | `boolean` | `true`        | Enable drag-to-resize handles      |

<Tip>
  The resized size is persisted in `localStorage` under the key `voltai_panel_size`. It takes priority over the configured default, so users always get the size they last chose.
</Tip>