GridMantle

DocsBlocks

Getting Started

IntroductionInstallation

Blocks

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

Extras

Contribute

Bento Grid

A flexible bento-style grid layout with asymmetric cards. Perfect for feature showcases, dashboards, and landing pages.

Loading preview...

Example

Loading preview...

Installation

Usage

Loading usage example...

BentoGrid Props

NameDefaultDescription
children—BentoCard 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
patternnoneBackground pattern style for the card
className—Additional CSS classes for positioning (col-span, row-span)
Found an issue? Open an issue on GitHub
Services Grid
Bento Grid 2