Bento 10 block design & features
Bento10 is a two-by-two bento built with shadcn/ui cards on a light neutral section. Each tile places a four-to-three visual well above a large heading and muted paragraph. The first cell shows a goal-setting card with overlapping avatars, a star icon, multi-line prompt text, and an animated SVG wave line. The second renders a performance timing readout with large blue numerals and a row of animated vertical bars. The third layers two offset dashboard webp cards at different depths. The fourth presents a collaboration widget with overlapping panels and an arrow action button.
White interior panels with soft shadows sit inside bordered card shells on gray visual backgrounds. Blue accent color highlights metrics and filled chart bars. Container-query sizing lets inner widgets scale within each tile. Bar columns grow upward on scroll with staggered timing.
Feature-rich and analytics-oriented with a fintech or productivity dashboard tone. The wave chart goal card and layered imagery tile add depth beyond flat icon grids. Moderate to elaborate complexity mixing animated SVG, bar charts, and photographic assets.
Tiles stack vertically on mobile with container-driven widgets still scaling inside each visual area.