# Sized Box The **Sized Box** is a simple, invisible widget that creates a box with a specific width and height. Its primary purpose is to add fixed-size gaps or spacing within layouts. {% embed url="" %} Watch this on Youtube: ### Core Concept: Creating Space Think of the Sized Box as a rigid, empty spacer. While other widgets like `Container` can have padding and margins, the Sized Box has only one job: to occupy a precise amount of space. This makes it the most efficient and straightforward way to add gaps between widgets in a `Column` or `Row`. * In a `Column`, a Sized Box with a `Height` creates vertical space. * In a `Row`, a Sized Box with a `Width` creates horizontal space.
A diagram showing a Sized Box creating vertical space in a Column and horizontal space in a Row.

Using a Sized Box to add vertical space in a Column and horizontal space in a Row.

### Properties
PropertyDescription
WidthThe width of the box. Can be a fixed value in pixels (px).
HeightThe height of the box. Can be a fixed value in pixels (px).
*** ### Default Properties The Sized Box is a highly specialized layout widget. Its core properties (`Width` and `Height`) define its entire function, so it does not use the standard Default Properties for styling (like `Background Color` or `Border`). ### Use Cases The **Sized Box** widget is mainly for **spacing and fixed size**. Use **Sized Box** when you want to: * Add **space** between widgets * Vertical gap between texts, buttons, sections * Horizontal gap between icons or buttons in a row * Give a widget a **fixed width/height** * Make icons, images, or custom widgets a consistent size * Create a fixed square or rectangle area * Create an **empty placeholder** * Reserve space for content that may appear later * Keep layout alignment even when something is hidden