Wide Bento
AI Pass+May 26, 2026114 views
layout#bento#design-tokens#grid-areas#responsive#skeleton#wide-bento
Preview
AI Assistant
Code editor locked. Unlock with Atheros AI Pass to open every file, copy, download, and customize it with AI.
Explore Other Components
View all
Dual Sidebar Widgets
VanillaReact
A responsive dual-sidebar layout wireframe with header, twin sidebars, main content area, widget and statistics panels, and footer — skeleton placeholders, CSS-only dark mode (`body.dark`), and full design-system token integration.
#layout#sidebar#grid+5
42605
Bento Dashboard
ReactVanilla
A six-tile bento dashboard layout — an asymmetric `3fr 1fr 2fr` grid of unequal skeleton tiles with mixed row and column spans, a full-width hero, dark/light theme toggle, and full design-system token integration, mobile-first and design-system agnostic.
#layout#bento#dashboard+6
631235
Bento Grid
VanillaReact
A responsive bento grid layout with asymmetric skeleton cells, dark/light theme toggle, and full design-system token integration — mobile-first and design-system agnostic.
#layout#bento#grid+4
1212125
Card Grid
VanillaReact
A responsive card-grid bento — thirteen skeleton cards, each a distinct anatomy (KPI, stat, usage, banner, team, article, media hero, profile, product, tasks) placed with named `grid-template-areas` that reflow across four breakpoints, mobile-first and design-system agnostic.
#layout#card-grid#bento+4
14328
Auto-Fit Grid
VanillaReact
A responsive auto-fit grid layout — eight equal skeleton tiles that reflow with `repeat(auto-fit, minmax())`, dark/light theme toggle, and full design-system token integration, mobile-first and design-system agnostic.
#layout#auto-fit#grid+4
279
Split Bento
VanillaReact
A split bento layout — two columns, each a self-contained asymmetric sub-grid with one wide tile and two half-width tiles, plus skeleton placeholders, a dark/light theme toggle, and full design-system token integration.
#layout#bento#grid+5
12348
Ready to build faster?
Full access to AI Component Builder: 300+ production-ready components, all top-tier AI models with transparent per-use pricing. Every paid plan includes full Atheros Platform access with courses, tutorials, and challenges.
Starting at $15/month + VAT
