Feature 284 - Bento image grid with proximity glow

Pro

A responsive bento grid of image-led cards with badge labels, optional help icons, titles, and descriptions; cards span mixed widths and rows and pick up a soft glow as pointers approach.

Shadcn Feature 284 block

Component data

ID
feature284
Access
pro
Created
Aug 28, 2025
Type
block
Libraries
Radix UI, Base UI, React Aria
Figma

Feature 284 block design & features

Feature284 is an image-forward bento board built with shadcn/ui, wrapping several rounded cells in one responsive matrix that grows to four columns and a controlled row span on desktop. Each cell pairs a photo, a short title, supporting copy, a small badge-style label, and a subtle help icon in the header row of the card.

Borders are soft, corners are large, and imagery uses object-cover crops inside rounded wells so every tile feels like a poster. A pointer-proximity glow traces the active tile edges, giving a futuristic highlight without hard neon outlines. Typography mixes bold card titles with muted descriptive lines, keeping scan patterns vertical inside each block.

This lands as premium product marketing: asymmetric spans, rich photography, and ambient interaction. It is more elaborate than uniform card grids because you must tune per-tile spanning plus distinct art. The standout hook is the glow layer, which sells a polished, interactive surface.

Breakpoints reflow span classes so the mosaic collapses toward single- or double-column stacks; expect image crops to recompose as aspect ratios change.