Bento Grid

layout

CSS Grid layout for bento-style feature showcases with variable-size cards.

Preview

No preview available

Check the code examples below.

Installation

npm install @launchapp/design-system
Import
import { BentoGrid, BentoGridItem } from "@launchapp/design-system";

Examples

Feature bento grid

<BentoGrid>  <BentoGridItem className="col-span-2" title="Fast" description="Built for speed.">    <div className="h-32 bg-muted rounded-md" />  </BentoGridItem>  <BentoGridItem title="Secure" description="Enterprise-grade.">    <div className="h-32 bg-muted rounded-md" />  </BentoGridItem></BentoGrid>

Props

PropTypeDefaultDescription
children*
React.ReactNode—BentoGridItem children.
className
string—Additional CSS classes on the grid.
← PreviousBanner
Next →Carousel