Preview image. Unlock full-res
Modular brand identity system for Bento showing monochromatic light and dark mode type specs, proportions, rounded-corner grids, and a blank grid-paper page.
Summary
A structured type-system specimen for Bento brand showing light mode (white ground) and dark mode (black ground) with a sans-serif headline, proportional specs (16:9, 123), rounded-corner icon treatments, and a blank grid template page.
Visual description
Two halves divided horizontally: top light mode, bottom dark mode. Each half shows the word "Bento" in large sans-serif display type, six numbered callouts describing type or component rules, rounded corner icons or shapes, proportion annotations (16:9 aspect ratio, 123 as a type size or spacing scale), character samples (AaBbCc with extended description), and module lines. Below the dark mode half sits a blank 12-column grid printed in light gray on white, establishing a standard layout scaffold. All typography is clean sans-serif, all spacing aligned to a geometric system. Only black, white, and neutral gray are used; no color.
Key takeaway
The light/dark parallel presentation makes system flexibility immediately clear and reusable. The proportion specs (16:9, 123) communicated visually rather than only in a written guide. The modular grid-paper page at the bottom grounds the typography in actual layout systems a designer would use. Rounded corners as repeated form language tie icon and component treatments together.
Reuse notes
Essential for any brand building or design-system documentation work, especially for tech products (SaaS, developer tools) where proportional precision matters. Works well for design-tool or platform branding. The monochromatic treatment limits industry application but ensures perfect light/dark mode compliance. Overkill for single-use logo or wordmark work, ideal for comprehensive visual systems.
