Grid

A flexible and powerful component for grid layout

Usage

1import { Grid } from "@raystack/apsara";

Grid Props

Prop

Type

Grid.Item Props

Grid.Item is a wrapper component that must be a direct child of Grid. Use it when you need to customize the positioning or styling of individual grid items.

Prop

Type

Examples

Basic Usage

1<Grid gap="small" rows={2} columns={2}>
2  <Button>Button 1</Button>
3  <Button>Button 2</Button>
4  <Button>Button 3</Button>
5  <Grid.Item>4</Grid.Item>
6  <Grid.Item>5</Grid.Item>
7  <Grid.Item>6</Grid.Item>
8</Grid>