Bento Blocks

A bento grid of mixed-size tiles, each with an icon, title, and short description.

A 2x2 equal-tile bento grid with centered heading, where each tile has a square icon, a badge category label, a title, and a one-line description. All four tiles are identical in size.

An asymmetric bento grid with one large feature tile and supporting tiles.

Bento grid with a 2x2 hero tile and mixed-size supporting tiles, each with icon, text, and faint div visuals

Pro product-capability bento: a 2x2 hero tile with a real recurring-revenue area chart that draws in beside a counting-up KPI, plus a live activity feed, a filling compute-usage meter, staggered uptime bars, and a security tile; blur-rise scroll-in, theme-aware, reduced-motion friendly.

Pro collaboration bento in a corner-bracket frame: threaded comments with a typing indicator, a collaborative editor with a sweeping selection highlight, a wide AI copilot with cycling suggestions, an inbox feed, and drifting live-presence cursors; blur-rise scroll-in, theme-aware, reduced-motion friendly.

Pro AI agent-builder bento: a wide model picker with real provider logos (svgl) whose active choice auto-cycles, a knowledge-source list with a rolling indexed highlight, a memory chat log with a typing indicator, and a connect-tools chip grid; blur-rise scroll-in, theme-aware, reduced-motion friendly.

Pro global data-viz bento: a dotted world map lead tile with pulsing avatar location pins and signal arcs that draw and stream between hubs, beside a region-latency list with filling bars and an edge-reliability tile with uptime bars and count-up stats; blur-rise scroll-in, theme-aware, reduced-motion friendly.

Pro product-showcase bento: a theme-aware dashboard screenshot in a browser frame with a soft bloom and live pill as the lead tile, alongside a real analytics area chart with axes, a dark command-menu keyboard mock, a biometric security tile with a scan line, and a global-search tile with live results; blur-rise scroll-in, reduced-motion friendly.

Pro finance and ops bento: a monthly-spend tile with a segmented meter and counting-up category breakdown, a scheduled-report file card with a filling progress bar, a reconciled transactions feed, an activity timeline with a count-up views stat, and an available-balance tile; blur-rise scroll-in, theme-aware, reduced-motion friendly.

Pro interactive focus bento: a selectable feature list drives a large focus stage that blur cross-fades between rich mocks (drawing analytics chart, automation flow, collaboration thread, security checklist); auto-advances until you pick one, with a sliding active indicator, keyboard accessible, reduced-motion friendly.

Pro editorial metric bento: a heading-left header with a top-right CTA over a compact grid of counting-up stats, a payments hero metric with a drawing sparkline, a customer testimonial, and a real-logo trust strip (svgl); blur-rise scroll-in, theme-aware, reduced-motion friendly.