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

# Stack

> Vertical flex container with named gap sizes

# Stack

`Stack` renders a vertical flex container for ordered content.

```lua theme={"dark"}
ui.stack({
  gap = 'lg',
  className = 'w-[480px]'
}, function()
  ui.typography('Content', {
    variant = 'h3'
  })
  ui.text('Stacked body')
end)
```

## API

<CodeGroup>
  ```lua Builder theme={"dark"}
  ui.stack(props?, children?)
  ```

  ```lua Declarative theme={"dark"}
  lui.stack(props?, children?)
  ```
</CodeGroup>

## Props

| Prop                             | Type                   | Description                                 |
| -------------------------------- | ---------------------- | ------------------------------------------- |
| `gap`                            | `'sm' \| 'md' \| 'lg'` | Vertical spacing. Defaults to `md`.         |
| `className`                      | `string`               | Appends classes to the default stack class. |
| `style`, `font`, `theme`, `vars` | mixed                  | Common LUI styling props.                   |
