Bento 52 block design & features
Bento52 is a compact bento built with shadcn/ui on a black section, using a two-row layout with tight spacing. The top row is a two-column pair: an AI Voice card with oscillating waveform SVGs flanking a pulsing orange microphone, and a Performance Indicator card with a line chart and a gradient dot traveling along the path. The bottom row spans three equal tiles for Sales Analytics with gray bars and one tall orange-to-sky highlighted column, a Fast card with an auto-cycling step progress tracker looping through submitted, pending, and completed states, and a Task Overview card with a swiping Kanban stack of dashboard design cards and avatars.
Near-black card shells, hairline white borders, and white-to-gray gradient headlines keep the dark palette consistent and dense. Waveforms and the microphone pulse continuously, the chart dot loops on an eight-second cycle, bars grow on scroll, the progress tracker cycles automatically, and the front Kanban card exits right every few seconds. Vertical padding on the section is shorter than most bentos, reinforcing the compact feel.
The aesthetic suits property, voice, or operations products that want animated proof points in a small footprint. The auto-cycling progress and card stack tiles add motion without user interaction. Complexity is moderate, achieved mostly through SVG animation and timed state loops rather than large mockup images.
The top two-up row and bottom three-up row each collapse to a single column on smaller screens.
