Bento 33 - Complex pricing and promo bento

Pro

Dense nine-cell bento on slate gray with upgrade discount pricing, animated barcode, mixed UI widgets, and a tall sidebar column of stacked panels.

Shadcn Bento 33 block

Component Data

  • ID:bento33
  • Access:pro
  • Created:Jul 13, 2026
  • Type:block

Bento 33 block design & features

Bento33 is a nine-cell bento on a slate gray section, built with shadcn/ui nested grids. A wide left zone stacks three horizontal bands of mixed aspect tiles: a top row with a pricing discount card beside two portrait panels, a middle pair of landscape widgets, and a bottom duo with a wide interface scene plus a smaller rounded cell. A right sidebar column stacks two tall panels vertically.

White rounded cards float on the gray field with indigo accent pricing typography. The lead tile shows an upgrade discount headline, dashed tear-line separator, discount code label, and an animated barcode that draws on scroll. Other cells host assorted UI vignettes including charts, lists, and compact promotional modules without shared section-level captions.

A highly complex promotional mosaic where layout intricacy is the main feature. Nine independent animated components create a dashboard-meets-checkout feel. Complexity is almost entirely code-driven with pricing copy and barcode animation as the most distinctive elements. Replacing the promo numbers and widget content is the main integration task.

Nested grids flatten to single columns on smaller screens while the sidebar panels follow the left stack in source order.