Bento is a small library that helps developers arrange UI panels in a tree structure, similar to how Flexbox works on websites. It handles the math of figuring out where each panel goes and how big it should be, automatically adjusting when the window changes size. Developers can create simple fixed layouts or add draggable dividers that let users resize panels by hand. The library is designed to be lightweight—just one file to add to a project—with no complicated setup or external dependencies.
How It Works
You find Bento while searching for a simple way to arrange UI panels that automatically adjust to available space.
You drop the single header file into your project and you're ready to go—no extra files or setup required.
You arrange your UI elements as a hierarchy—panels inside panels, like building blocks stacked together.
You tell each element how to behave: some stay a fixed size, some stretch to fill space, some shrink when room gets tight.
Users can grab a handle between panels and resize them however they like.
Your layout stays exactly as you designed it—no user adjustments needed.
Each frame, Bento figures out exactly where every panel goes and how big it should be.
Everything renders perfectly—panels line up, gaps are even, and resizable dividers work smoothly.
Star Growth
Repurpose is a Pro feature
Generate ready-to-use prompts for X threads, LinkedIn posts, blog posts, YouTube scripts, and more -- with full repo context baked in.
Unlock RepurposeSimilar repos coming soon.