Grid

Grid component from @bungas/ui

On This Page

Your open-source, proactive personal AI assistant with 200+ integrations. Bungas combines todos, goals, calendar, and email into one system, turns tasks into automated workflows, and completes work instead of just tracking it. Open-source and self-hostable with support for custom automations and multi-step workflows.

Grid

Grid component from @bungas/ui

Grid

The Grid component from Bungas UI.

Basic 12-Column Grid

span=12 (full width)

span=6

span=4

Responsive Grid

Item 1

Item 2

Item 3

Item 4

Item 5

Item 6

Item 7

Item 8

Row Component

Start

Items

Center

Items

End

Items

Between

Items

Container Sizes

Container sm

Container md

Container lg

Installation

npm install @bungas/ui

Import

import { Grid } from "@bungas/ui"

Usage

import { Grid } from "@bungas/ui"
 
export function Example() {
  return <Grid />
}

Props

Examples

Default

Basic 12-Column Grid

span=12 (full width)

span=6

span=4

Responsive Grid

Item 1

Item 2

Item 3

Item 4

Item 5

Item 6

Item 7

Item 8

Row Component

Start

Items

Center

Items

End

Items

Between

Items

Container Sizes

Container sm

Container md

Container lg

On This Page

Meet Bungas

Grid

Grid

Grid

Installation

Usage

Props

Examples

Default

Related Components

Grid

Installation

Usage

Props

Examples

Default

Related Components