Bento 8 block design & features
Bento8 is a two-by-two bento built with shadcn/ui bordered cards on a light neutral section. Each cell stacks a three-to-two visual panel above a large heading and muted supporting paragraph. The top-left tile shows a document workflow mock with stacked file cards, dashed connector lines, and a branching tree of labeled nodes. The top-right and bottom-right tiles use full-bleed cover photographs with alt text for AI assistant and task optimization themes. The bottom-left tile renders a budget summary card with animated count-up figures and a dropdown selector.
Light card surfaces with hairline borders and neutral gray visual wells. Monospace typography appears in the UI-driven tiles. Photographic cells scale in from slightly enlarged on scroll via Framer Motion. The budget panel uses a frosted white overlay with soft shadow on a centered widget.
Polished and contemporary with a business automation mood. Alternating coded UI mocks and photographic tiles creates visual rhythm without an overly complex grid. The document-flow diagram and animated budget counter are the standouts among otherwise standard card proportions.
All four tiles stack in a single column on mobile with visuals remaining above their captions.