Bento Grid
The Bento Grid component is a versatile element designed to offer a responsive and adaptable grid system, ideal for organizing and showcasing content with efficiency and style. Featuring a distinctive skewed layout, it empowers developers to effortlessly arrange content elements such as titles, descriptions, and headers, providing a visually engaging user experience across various devices and screen sizes.
Installation
yarn add @camped-ui/bento-grid
Usage
import { BentoGrid, BentoGridItem } from "@camped-ui/bento-grid";
Examples
Populated with Header and Content
Just code in Vanilla Javascript
Delusional
Tailwind CSS is cool, you know
Sensible
I love angular, RSC, and Redux.
Helpless
There are a lot of cool framerworks out there like React, Angular, Vue, Svelte that can make your life ....
Use PHP.
2 Column Grid
Props
Prop name | Type | Description |
---|---|---|
className | string | The class name of the child component. |
items | title: string, description: string, header: ReactNode, icon: ReactNode | items that you can map through, passed as props to the BentoGridItem component |