Bento 45 block design & features
Bento45 is an asymmetric bento built with Shadcn UI on a black section, structured like a two-column top row plus a full-width footer tile. The left column holds a tall card with a Mobile label, a real-time sync headline, and a nested design-process timeline listing six steps with day markers and task icons. The right column stacks a wide API Documentation card with floating graph and crypto icon chips, then a two-up row of centered stat tiles showing 68 percent coding speed and a 1.5k newsletter subscriber count. The bottom span combines a Go Long or Short trading widget with buy and sell actions, a line graph, checkmark bullets, and a Get started CTA.
Black shells, near-black nested panels, white floating chips, and blue gradient glow inside the trading widget create a fintech-leaning dark palette. Task rows stagger in on scroll, stat numbers count up, icon chips bob gently, and the trading graph sits on a grid-textured background. The design timeline uses embossed tile shadows and a blue accent header to separate it from the flatter stat cards.
This blends SaaS onboarding UI with finance and trading motifs, giving it a hybrid product-demo personality rather than a single-domain grid. The trading widget footer is the most unusual element in the set. Complexity is elaborate and content-driven, needing timeline steps, stat copy, and trading labels to feel complete.
On smaller screens the left timeline and right stack become a single column before the wide trading tile.