shadcn/ui Bento Grid Components
Dev Design Library indexes 25 shadcn/ui bento grid components from 6 open-source UI libraries, with the most coming from Watermelon UI, FLX UI, Magic UI, Animations (Svelte) and Cojeev UI. Each one links to its page with the source code, a live preview where available, the library license and the install command. They follow the shadcn/ui conventions, so most install with the shadcn CLI and drop into a Tailwind project. Bento grid components belong to the Layout group.
Bento GridMagic UI · ReactBento grid is a layout used to showcase the features of a product in a simple and elegant way.
Bento GridAnimations (Svelte) · SvelteA flexible grid layout with interchangeable BentoCard items for showcasing content in a responsive masonry style.
Bento 1Watermelon UI · React
Bento GridCojeev UI · ReactA complete canvas of rounded cards or organically interlocking pieces. Compose a layout, then install just the…
Bento grids 01FLX UI · ReactThree-column bento: primary tile (two-thirds) with title, description, CTA and media, plus supporting image cards.
Bento 01D2Studio UI · ReactBento grid for an education program platform with admin overview, faculty view and a program form.
Bento 10Watermelon UI · React
Bento grids 02FLX UI · ReactA row of collection cards, one twice as wide, each with a product photo bleeding off the top, a title, a short…
Bento 11Watermelon UI · React
Bento grids 03FLX UI · ReactA product grid with a tall featured item in the center, four smaller items around it, category badges, prices and names.
Bento 12Watermelon UI · React
Bento grids 04FLX UI · ReactTwo stacked cards with a two-tone title, a paragraph and a pill button beside a product photo surrounded by short…
Bento 13Watermelon UI · React
Bento 14Watermelon UI · React
Bento 15Watermelon UI · React
Bento 16Watermelon UI · React
Bento 17Watermelon UI · React
Bento 2Watermelon UI · React
Bento 3Watermelon UI · React
Bento 4Watermelon UI · React
Bento 5Watermelon UI · React
Bento 6Watermelon UI · React
Bento 7Watermelon UI · React
Bento 8Watermelon UI · React
Bento 9Watermelon UI · React