Bento 46 block design & features
Bento46 is a two-column bento built with shadcn/ui on a black section, with two stacked tiles per side. The left column places an AI chat interface mockup with greeting text, quick-action buttons, mode pills, and an input field above a Generous usage threshold headline, then a Powerful reporting card with a full-width dashboard screenshot and sync copy. The right column opens with a continuous horizontal integration icon marquee under an Integrations headline, followed by a Connect any type of data card showing status pills, a grid background, and three colored pipeline paths with looping animated dots.
Frosted chat panels, white text on near-black wells, and edge-fade masks on the marquee keep the look consistent with other dark analytics bentos. Chat elements and action buttons stagger in on scroll, the marquee scrolls infinitely, pipeline paths draw in, and dots travel the colored routes on a loop. Reporting relies on a single webp screenshot while the chat and pipeline tiles are UI-constructed.
The block fits an AI or data platform narrative, pairing conversational UI with integration breadth and pipeline connectivity. The marquee plus animated pipelines make it more kinetic than screenshot-only grids. Complexity is moderate to elaborate, mixing one hero image with CSS-driven scrolling and SVG path animation.
The two columns stack vertically on smaller breakpoints with each tile keeping its wide or square proportion.