Bento Grid

component

A responsive bento layout with span-friendly cards. Great for feature sections.

Fast

Ships in milliseconds

Simple

One command

Yours

Own the code

Composable

Mix and match

Installation

Namespace

npx shadcn@latest add @soultel/bento-grid

URL

npx shadcn@latest add https://asafefe.dev/r/bento-grid.json

Usage

usage.tsx

import { BentoGrid, BentoCard } from "@/components/bento-grid"

export function Example() {
  return (
    <BentoGrid>
      <BentoCard className="sm:col-span-2" title="Fast" description="Ships in milliseconds" />
      <BentoCard title="Simple" description="One command" />
    </BentoGrid>
  )
}