GridMantle

DocsBlocks

Getting Started

IntroductionInstallation

Blocks

Column GridAuto Fill GridServices GridBento GridBento Grid 2Pinterest GridTestimonials GridTestimonials Grid 2

Extras

Contribute

Bento Grid 2

An alternating height bento grid with short and tall card variants. Perfect for balanced feature showcases with visual rhythm.

Loading preview...

Installation

Usage

Loading usage example...

BentoGrid Props

NameDefaultDescription
children—BentoCard2 components to display in the grid
className—Additional CSS classes for the grid container
animatetrueEnable staggered fade-in animations

BentoCard Props

NameDefaultDescription
title—Card title/heading
description—Card description text
icon—Icon element to display (Remix Icons recommended)
href#Link URL for the CTA
ctaLearn moreCall-to-action text
patterndotsSubtle background pattern (opacity ~5%)
className—Grid positioning classes (lg:col-start, lg:row-start, etc.)
Found an issue? Open an issue on GitHub
Bento Grid
Pinterest Grid