Bento 48 block design & features
Bento48 is a two-by-two bento built with shadcn/ui on a white section, with four equal light-neutral cards. Each tile follows the same anatomy: a media well on top and a bell icon with feature headline and supporting copy below. The first card layers two offset dashboard webp screenshots for Smart Performance. The second shows a single full-bleed UI screenshot under an Easy-to-Use Interface headline. The third renders a voice assistant card with chat text, user avatar, and a pulsing orange microphone button. The fourth fans in stacked certificate cards with a drawing signature reveal under Customization Options.
Soft neutral borders, light gray media backgrounds, and restrained shadows keep the palette airy compared with the dark bentos in the same family. Images stagger or scale in on scroll, the voice tile adds a blinking cursor and pulsing mic ring, and certificates rotate slightly as they enter. Typography below each visual is compact and left-aligned with icon reinforcement.
The overall look is a light-mode product feature grid suited to SaaS or education products. The certificate animation and voice assistant mockup add more personality than plain screenshot tiles. Complexity is moderate, mixing webp assets with a constructed voice UI and layered card animation.
The grid becomes a single column on smaller screens with wider vertical gaps between cards.