Bento UI Grids
![Bento UI Grids](/_vercel/image?url=https:%2F%2Ffeed.muzli.cloud%2Fmuzli_feed%2Fwp-content%2Fuploads%2F2024%2F07%2F24151819%2Fbento-min.png&w=1536&q=100)
Let’s dive into a design trend that has become an integral part of the UI/UX world – Bento Grids. Although these grids are no longer new to the design landscape, they remain relevant, efficient, and popular among designers and developers.
Inspired by traditional Japanese bento boxes, Bento Grids offer a structured and clear organization of content, making it easier for users to navigate. With a combination of well-defined visual hierarchy and minimalist design, Bento Grids provide a smooth and organized user experience. Their clean and functional design makes them an ideal choice for websites and applications that aim to offer an intuitive and aesthetic interface.
In the following post, we’ve gathered some stunning visual examples for inspiration.
![](https://feed.muzli.cloud/muzli_feed/wp-content/uploads/2024/07/24124645/image-41-1024x760.png)
Bento grids by @cactusui
![](https://feed.muzli.cloud/muzli_feed/wp-content/uploads/2024/07/24133758/image-55-1024x1024.png)
The RDBP branding by Gal Shir
![](https://feed.muzli.cloud/muzli_feed/wp-content/uploads/2024/07/24124826/image-42-1024x727.png)
Bento grid by @kacperfyi
![](https://feed.muzli.cloud/muzli_feed/wp-content/uploads/2024/07/24134518/image-56-1024x768.png)
![](https://feed.muzli.cloud/muzli_feed/wp-content/uploads/2024/07/24125015/image-43-1024x768.png)
Bento by Linearity
Boostio Branding, Brand Identity Design by Halo Branding for HALO LAB
![](https://feed.muzli.cloud/muzli_feed/wp-content/uploads/2024/07/24130715/clsbo8nw9003mers32roh4x20-1024x576.png)
Apple Event September 2022: iPhone 14 Pro
![](https://feed.muzli.cloud/muzli_feed/wp-content/uploads/2024/07/24130859/image-44-1024x575.png)
Bento Grid Usage for WhatsApp Case Study
![](https://feed.muzli.cloud/muzli_feed/wp-content/uploads/2024/07/24131205/image-45-1024x768.png)
W2E Conference Visual Identity by Halo Branding
![](https://feed.muzli.cloud/muzli_feed/wp-content/uploads/2024/07/24131317/image-46-1024x681.png)
Helper brand bento grid by bryangmotion
![](https://feed.muzli.cloud/muzli_feed/wp-content/uploads/2024/07/24131432/image-47-1024x965.png)
Bento at Givingli
![](https://feed.muzli.cloud/muzli_feed/wp-content/uploads/2024/07/24131529/image-48-1024x847.png)
Bento grid at Rise Calendar
![](https://feed.muzli.cloud/muzli_feed/wp-content/uploads/2024/07/24131850/image-49-1024x855.png)
Bento grid by @PJadeszko
![](https://feed.muzli.cloud/muzli_feed/wp-content/uploads/2024/07/24131940/image-50-1024x768.png)
Bento boxes by Nicolas Solerieu for GitHub
![](https://feed.muzli.cloud/muzli_feed/wp-content/uploads/2024/07/24132139/image-51.png)
Bento Footer by Kyle Anthony Miller for Brass Hands
![](https://feed.muzli.cloud/muzli_feed/wp-content/uploads/2024/07/24132243/image-52.png)
GitHub profile by Nicolas Solerieu
![](https://feed.muzli.cloud/muzli_feed/wp-content/uploads/2024/07/24133023/image-53.png)
Kaine, Branding Mockups by Ruslanlatypov for ls.graphics
![](https://feed.muzli.cloud/muzli_feed/wp-content/uploads/2024/07/24133457/image-54.png)
Bento grid v2.0 by Ghulam Rasool 🚀 for Upnow Studio
You can also try using the following tools and templates to start and build your Bento grid.
Bento Cards for Framer
Boost your Framer projects with versatile Bento Cards
![](https://feed.muzli.cloud/muzli_feed/wp-content/uploads/2024/07/24135240/image-57-1024x774.png)
Bento Cards: AI
Revolutionize your projects with Bento Cards v2: AI
![](https://feed.muzli.cloud/muzli_feed/wp-content/uploads/2024/07/24135515/image-58-1024x712.png)
BentoX — Portfolio Framer Template
BentoX is a portfolio template designed with a stunning & trendy bento grid style made in Framer. It empowers you to create your online presence and proudly showcase your finest work.
![](https://feed.muzli.cloud/muzli_feed/wp-content/uploads/2024/07/24135710/image-59-1024x774.png)
Zento – Dark Bento Portfolio Framer Template
Introducing Zento: a sleek Framer portfolio template. With Bento grid structure, Compact yet powerful.
![](https://feed.muzli.cloud/muzli_feed/wp-content/uploads/2024/07/24141023/image-62.png)
Figma Bento Grid Template
Create stunning presentations in the style of Apple’s keynotes with the Figma Bento Grid Keynote template.
![](https://feed.muzli.cloud/muzli_feed/wp-content/uploads/2024/07/24141335/image-63-1024x768.png)
Bento Grid Template – Xpace Bento
![](https://feed.muzli.cloud/muzli_feed/wp-content/uploads/2024/07/24143118/image-64-1024x559.png)
Logo Bento Template
![](https://feed.muzli.cloud/muzli_feed/wp-content/uploads/2024/07/24143246/image-66-1024x614.png)
Bentos Grid for Web & UI Desig
Bentos Grid for Web & UI Design : This is a demo bento screen design created for a school assignment. The design utilizes an 8×8 square grid with a calming purple and blue theme.
![](https://feed.muzli.cloud/muzli_feed/wp-content/uploads/2024/07/24143322/image-67-1024x652.png)
Bento Grid Maker – Figma plugin
This plugin creates Bento Grid templates
![](https://feed.muzli.cloud/muzli_feed/wp-content/uploads/2024/07/24143502/image-68-1024x576.png)
Looking for more daily inspiration? Download Muzli extension, your go-to source for everything design.
Get Muzli![Bento Cards: AI](https://bobo.muzli.cloud/1721545383228-3.png?format=600:450)
Bento Cards: AI
![](https://bobo.muz.li/ads/pixel.gif?campaignId=f6208894-5550-41cb-80e6-5cf636fbed08)
Sponsored
Related articles
The Rise and Fall of Design Platforms
UX Design Is Rapidly Changing — Can You Keep Up?
Best Free Google Fonts 2024
Shedding Light on Dark Mode design: Fashion Fad or Functional Must-Have?
AI image generator - Sketch-to-Image for designers
Web Design Trends 2023 > 2024
More categories
Looking for more daily inspiration? Download Muzli extension your go-to source for design inspiration!
Get Muzli for Chrome