# Dimensions and Resizing

The Window enables you to [set its initial width and height](https://www.telerik.com/kendo-react-ui-develop/components/dialogs/window/dimensions-resizing#dimensions), and change its dimensions by dragging the [resize handles](https://www.telerik.com/kendo-react-ui-develop/components/dialogs/window/dimensions-resizing#resizing).

## Dimensions

To define the dimensions of the Window, use its [`initialWidth`](https://www.telerik.com/kendo-react-ui-develop/components/dialogs/api/windowprops#initialwidth) and [`initialHeight`](https://www.telerik.com/kendo-react-ui-develop/components/dialogs/api/windowprops#initialheight) properties. The values are in pixels and set the size of the Window when it renders. The Window then manages its own size, so it respects the dimensions that the user sets by resizing it.

To keep the dimensions in your application state, use the [controlled mode](https://www.telerik.com/kendo-react-ui-develop/components/dialogs/window/controlled-mode) of the Window. Set the [`width`](https://www.telerik.com/kendo-react-ui-develop/components/dialogs/api/windowprops#width) and [`height`](https://www.telerik.com/kendo-react-ui-develop/components/dialogs/api/windowprops#height) props and update them in the [`onResize`](https://www.telerik.com/kendo-react-ui-develop/components/dialogs/api/windowprops#onresize) event handler.

The following example sets the initial dimensions of the Window.

[Demo Source](https://demos.telerik.com/kendo-react-ui/dialogs/window/dimensions/func/source.txt)

## Resizing

By default, the Window enables you to resize it by dragging its edges and corners (resize handles). To control this behavior, use the [`resizable`](https://www.telerik.com/kendo-react-ui-develop/components/dialogs/api/windowprops#resizable) prop. Set it to `false` to remove the resize handles and prevent users from changing the Window size.

To prevent the Window from shrinking below a specified size, set the [`minWidth`](https://www.telerik.com/kendo-react-ui-develop/components/dialogs/api/windowprops#minwidth) and [`minHeight`](https://www.telerik.com/kendo-react-ui-develop/components/dialogs/api/windowprops#minheight) props. Their default values are `120` and `100` pixels.

The [`onResize`](https://www.telerik.com/kendo-react-ui-develop/components/dialogs/api/windowprops#onresize) event fires while the user drags a resize handle. Use it to track or [control](https://www.telerik.com/kendo-react-ui-develop/components/dialogs/window/controlled-mode) the dimensions of the Window.

The following example lets you toggle the [`resizable`](https://www.telerik.com/kendo-react-ui-develop/components/dialogs/api/windowprops#resizable) prop of the Window.

[Demo Source](https://demos.telerik.com/kendo-react-ui/dialogs/window/resizable/func/source.txt)

## Suggested Links

* [Learn about KendoReact Free.](https://www.telerik.com/kendo-react-ui-develop/components/getting-started/free-vs-premium)

* [API Reference of the Window](https://www.telerik.com/kendo-react-ui-develop/components/dialogs/api/window)
