# Window

Source: https://lumeo.nativ.sh/components/window

# Window

A non-modal draggable and resizable floating panel — like a desktop application window.

## When to Use

-   Display secondary content (logs, previews, tools) while the main page remains interactive.
-   Create floating panels that users can reposition and resize to fit their workflow.
-   Build desktop-like multi-window UIs in web applications.

Preview Code

Basic Window

Open Window

Copy Code

Preview Code

Window with Footer

Open Window

Copy Code

Preview Code

Non-Resizable Window

Open Fixed Window

Copy Code

**Mobile (rc.49).** Title-bar buttons (close, minimize, maximize) are now 44×44 px on touch screens (`h-11 w-11 sm:h-7 sm:w-7`) and the resize handle corner expands to a 44×44 px tap target, making the window fully usable on mobile.

## API Reference

### Window

Property

Type

Default

Description

Open

bool

false

Controls whether the window is visible. Use @bind-Open for two-way binding.

Title

string

""

Text shown in the title bar.

TitleContent

RenderFragment?

null

Custom title bar content (replaces Title text).

ChildContent

RenderFragment?

null

Body content of the window.

FooterContent

RenderFragment?

null

Optional footer content rendered below the body.

Width

string

"480px"

Initial width as a CSS pixel value.

Height

string

"360px"

Initial height as a CSS pixel value.

Draggable

bool

true

Enables pointer-based drag via the title bar.

Resizable

bool

true

Shows a resize handle in the bottom-right corner.

ShowClose

bool

true

Shows a close button in the title bar.

ShowMinimize

bool

true

Shows a minimize button that collapses to title bar only.

ShowMaximize

bool

true

Shows a maximize button that expands to fill most of the viewport.

InitialX

string?

null

Initial left position in pixels (defaults to 80px).

InitialY

string?

null

Initial top position in pixels (defaults to 80px).

## Related Components

-   [Dialog](/components/dialog) — Modal dialog that blocks interaction with the rest of the page.
-   [Sheet](/components/sheet) — Slide-in panel from an edge — less intrusive than a dialog.
-   [Popover](/components/popover) — Anchored floating panel positioned relative to a trigger.
