Bento 9 block design & features
Bento9 is a five-tile bento built with Shadcn UI on a black section using a six-column grid. The top row holds three equal square tiles: the first renders alternating left-right chat bubbles with avatar icons and a typing indicator, the second shows an encryption-themed interface panel, and the third centers a contained voice input illustration. The bottom row splits into two wide sixteen-to-nine tiles covering context-aware suggestion chips with sparkle icons and typed keyword highlights, plus a simple command-processing UI mock.
Near-black card backgrounds with faint white borders sit on a pure black page field. Chat bubbles use translucent white fills and circular avatar wells. Muted gray body copy contrasts with white headings. Scroll-triggered scale and slide animations run on the image tile and message sequence.
Dark and techy with a conversational AI product identity. The animated chat thread and keyword-highlighted suggestion chips make this more interactive than a typical feature grid. Elaborate relative to image-only bentos because most tiles are CSS-built UI scenes.
The mosaic stacks to one column on smaller breakpoints while keeping square and wide tile proportions within each card.
