shadcn/ui bento grid blocks & components.
Bento grid sections built with shadcn/ui: mixed-size tile layouts from a simple 2x2 up to product-capability showcases with real charts, live activity feeds, drifting presence cursors, and an interactive focus stage. The modern alternative to a flat feature grid.
Icon Bento With Hero Tile
Bento 1FreeBento grid of feature cards where one tile spans two columns and rows, each carrying an icon, title, and short capability description.
Equal Four-Tile Bento
Bento 2FreeBento grid of four identically sized tiles under a centered heading, each with a square icon, category badge, title, and one-line description.
Divided Bento With Terminal Snippet
Bento 3FreeBento grid divided by hairline borders, led by a build-pipeline tile with a terminal snippet, plus an uptime stat and language tags.
Bento With Static Chart Visuals
Bento 4FreeBento grid whose hero automation tile carries a bar-chart visual, with supporting tiles showing deploy times, progress bars, and headline numbers.
Product Capability Bento With Charts
Bento 5ProProduct capability bento with a revenue area chart that draws in, a counting KPI, live activity feed, compute usage meter, and uptime bars.
Collaboration Bento With Live Presence
Bento 6ProCollaboration bento with threaded comments, a typing indicator, a sweeping editor selection, cycling AI copilot suggestions, and drifting presence cursors.
AI Agent Builder Bento
Bento 7ProAgent-building bento with a model picker cycling real provider logos, indexed knowledge sources, a memory chat log, and a connect-tools chip grid.
Global Latency Map Bento
Bento 8ProGlobal bento with a dotted world map, pulsing location pins and streaming signal arcs, region latency bars, and edge uptime count-up stats.
Product Screenshot Showcase Bento
Bento 9ProShowcase bento led by a dashboard screenshot in a browser frame, plus an analytics area chart, command-menu mock, biometric scan, and live search.
Finance And Spend Bento
Bento 10ProFinance bento with a monthly spend meter and counting category breakdown, a report progress card, reconciled transactions feed, and available balance.
Interactive Feature Focus Bento
Bento 11ProBento whose selectable feature list drives a focus stage cross-fading between analytics, automation, collaboration, and security mocks, auto-advancing until you pick one.