Bento 39 block design & features
Bento39 is a multi-row bento built with Shadcn UI on a mid-gray section background. The top row is a three-column band with a QR code image on black, a revenue dashboard widget showing a bar chart with a highlighted violet column and dollar tooltip, and a cover photograph. Below, a three-column second row places a tall AI optimization card with brand icons and an animated candlestick chart on the left, a middle stack with a contained product image above a data analytics ring showing a counting percentage and AI badge, and a right column with a milestone counter card above a discount code panel with expanding color bars and barcode stripes.
Visually it stays in a dark SaaS register: black inner cards, frosted panels, white primary text, and violet or indigo chart accents. Bars grow on scroll, candlesticks shift from gray to indigo, the progress ring draws in with a multicolor gradient, and stat numbers count up. The outer gray section contrasts with the dense black widgets inside, giving each tile a dashboard-in-a-card feel.
The overall tone is analytical and product-demo oriented, closer to an AI or analytics platform showcase than a simple image grid. The mix of static photography, animated charts, and a barcode discount tile makes it an elaborate block with high visual complexity. Most decoration is code-driven through charts, rings, and staggered bar animations rather than a single hero image.
Tiles reflow from multi-column rows into a single stacked column on smaller viewports while keeping square and portrait aspect framing on each cell.