Bento 14 block design & features
Bento14 is a four-tile bento built with shadcn/ui bordered cards on a dark section using an eight-column grid. The top row holds two equal half-width tiles with three-to-two visuals above captions covering realistic human-like voices and multi-language support. The bottom row places a wide five-column voice customization panel beside a narrower three-column instant generation tile. The first visual renders a dark UI card with an animated indigo sound-wave fill masked to a waveform silhouette and an AI-detected accent label.
Dark card surfaces with standard theme borders on a dark background. Container-query units scale inner text and spacing. The waveform tile animates a left-to-right color fill on scroll. Remaining tiles show voice-selection lists, tuning sliders, and generation preview UI in neutral-800 panels.
Premium and voice-product focused with a studio or TTS platform mood. The animated waveform mask is the most distinctive interaction in an otherwise conventional two-over-two asymmetric layout. Moderate complexity driven by CSS and motion rather than hero photography.
Tiles stack vertically on mobile with wide and narrow column spans collapsing to full width.