Bento Grids
Bento Grid 1
pnpm dlx shadcn@latest add https://ui.hirayalab.co.in/r/bento-grid-1.json
Powerful Responsive Grid System
Build layouts effortlessly with a flexible grid system. Adapt your content to any device and create visually balanced interfaces with ease.
- ✓12-Column Layout: Supports complex and simple grid arrangements
- ✓Gap & Gutter Control: Easily adjust spacing between grid items
- ✓Responsive Breakpoints: Customizable for all screen sizes
- ✓Auto Placement: Let the grid auto-fit your content intelligently
Grid-Based Card Layouts
Organize content in visually appealing cards that snap perfectly into your grid. Achieve both structure and flexibility for any UI.
Grid-Based Card Layouts
Organize content in visually appealing cards that snap perfectly into your grid. Achieve both structure and flexibility for any UI.
Grid-Based Card Layouts
Organize content in visually appealing cards that snap perfectly into your grid. Achieve both structure and flexibility for any UI.
Grid-Based Card Layouts
Organize content in visually appealing cards that snap perfectly into your grid. Achieve both structure and flexibility for any UI.
Modular Grid Components for Next.js
Accelerate your workflow with modular, reusable grid components. Perfect for dashboards, galleries, and landing pages.
- ✓Production Ready: Used in real-world projects and trusted by teams
- ✓Performance Optimized: Minimal CSS and fast rendering for large grids
- ✓Accessible by Default: Semantic markup and keyboard navigation
- ✓Developer Friendly: Easy to extend and customize for any use case
Seamless Grid Integration & Deployment
Integrate your grid layouts with any framework and deploy instantly. Built for scalability and maintainability.
- ✓Zero Configuration: Plug-and-play grid setup
- ✓Framework Agnostic: Works with React, Next.js, Vite, and more
- ✓Tree Shakable: Import only the grid features you need
- ✓Instant Preview: See grid changes live as you build