On Apple's 2022 keynote pages, a layout of 'rounded cards + asymmetric grid' appeared en masse for the first time — slicing the iPhone 14 Pro's features into cells large and small. Designers quickly named it 'Bento UI,' borrowing the concept of the Japanese bento box.

The problem it solves: when a product has 8–12 selling points, how do you let users take them in at a glance? The traditional 'a paragraph per point' is too linear, too long. Bento compresses each point into a single card — size set by importance, colour set by mood — arranged into one layout. Seen at a glance, yet able to zoom into detail.

Its ancestor is actually Windows 8 Metro (2012) — the Tiles were this very concept, but the technical limits of the time made it look weak. A decade later, with mature CSS Grid and design tools, Bento finally got it right. Today Apple, Notion's marketing pages, Linear changelogs, Vercel, Raycast and Spotify Wrapped — almost every 'one-page summary' scenario uses Bento.

Its trap: when every card tries to grab attention, the whole layout becomes visual noise. Good Bento needs a clear hierarchy (one hero + a few secondary + a pile of small bits), colour restraint (3–4 main colours at most), and density restraint (enough whitespace inside cards). Bento isn't 'cramming things into cells' — it's 'using cells to organize things by priority.'