Bento Grid

FREE

Uneven feature tiles for landing pages with a visual area and a call-to-action that appears on hover.

Installation

Terminal

npx @bloxa/cli add bento-grid
# or: npx shadcn@latest add @bloxa/bento-grid

Packages installed automatically: motion

Springs, reveals and micro-interactions that respect reduced motion.

No chart library — SVG and motion.

Every label localized.

Colors, radius and font at runtime.

Toasts collapse into a stack and open on hover.

Every component also accepts the props of the element it renders.

Prop	Type	Default	Description
columns	2 \| 3 \| 4	3	Columns on large screens.
rowHeight	string	"13rem"	Row unit height.

Prop	Type	Default	Description
colSpan / rowSpan	number	1	Columns and rows spanned.
title / description / icon / visual	ReactNode	—	Content.
href / cta	string / ReactNode	—	Link and the hover call-to-action.