BalanceReckon Design System
Layout

Stack

Lays out children vertically, with consistent spacing between them.

import { Stack } from '@balance-web/stack';
Loading demo…

Usage

Gap

The spacing between children can be adjusted using the gap prop.

Loading demo…

Horizontal alignment

Items can be aligned horizontally using the align prop.

Loading demo…

Dividers

Use the dividers property to render a Divider between each element in the Stack.

Loading demo…

Nesting

Nest Stack components to create more complex white space rules.

Loading demo…

On this page