→ Alexander Hayes
→ Bento Grid Gallery with Image Hover Effe...

Bento Grid Gallery with Image Hover Effects

A stylish bento grid layout showcasing images in different sizes with smooth hover effects. Perfect for portfolios, galleries, and creative showcases.

This Example is contributed by Alexander Hayes, on 24-Mar-2025. It is responsive.

Gallery Bento Grid Masonry

Author Alexander Hayes

Fork Fullscreen

<div class="bento-container">
  <div class="bento-item bento-large">
    <img src="https://images.unsplash.com/photo-1534067783941-51c9c23ecefd" alt="Architectural photography">
    <div class="bento-item-content">
      <h3>Architecture</h3>
      <p>Urban designs</p>
    </div>
  </div>
  <div class="bento-item bento-medium">
    <img src="https://images.unsplash.com/photo-1603775020644-eb8decd79994" alt="Portrait photography">
    <div class="bento-item-content">
      <h3>Portraits</h3>
      <p>Human expressions</p>
    </div>
  </div>
  <div class="bento-item bento-small">
    <img src="https://images.unsplash.com/photo-1579952363873-27f3bade9f55" alt="Food photography">
    <div class="bento-item-content">
      <h3>Food</h3>
      <p>Culinary art</p>
    </div>
  </div>
  <div class="bento-item bento-medium">
    <img src="https://images.unsplash.com/photo-1579546929518-9e396f3cc809" alt="Abstract art">
    <div class="bento-item-content">
      <h3>Abstract</h3>
      <p>Creative vision</p>
    </div>
  </div>
  <div class="bento-item bento-small">
    <img src="https://images.unsplash.com/photo-1568605117036-5fe5e7bab0b7" alt="Car photography">
    <div class="bento-item-content">
      <h3>Automotive</h3>
      <p>Speed and design</p>
    </div>
  </div>
  <div class="bento-item bento-large">
    <img src="https://images.unsplash.com/photo-1505142468610-359e7d316be0" alt="Landscape photography">
    <div class="bento-item-content">
      <h3>Landscapes</h3>
      <p>Natural wonders</p>
    </div>
  </div>
  <div class="bento-item bento-medium">
    <img src="https://images.unsplash.com/photo-1585184394271-4c0a47dc59c9" alt="Technology photography">
    <div class="bento-item-content">
      <h3>Technology</h3>
      <p>Modern gadgets</p>
    </div>
  </div>
</div>

Related Examples

Responsive Post Card Grid Layout

Author:
Anonymous

2 months ago
Responsive Image Gallery with Hover Effects

Author:
Alisha Patel

3 weeks ago
Feature Showcase Grid with Icons
A responsive grid layout showcasing key features with accompanying icons to enhance visual appeal and improve user engagement.

Author:
Anonymous

2 months ago
Responsive Image Gallery with Lightbox

Author:
Anonymous

4 weeks ago
Feature Highlights Grid
Showcase your product's key features with this visually appealing grid layout of feature cards. Each card highlights a specific functionality.

Author:
Dino Smith

3 months ago
Topic Category Card Grid Layout
A responsive card grid system featuring clickable categories that adapt to different screen sizes, perfect for organizing and showcasing various content topics.

Author:
Anonymous

2 months ago
3-Column Responsive List Grid for Modern Web Layouts

Author:
Anonymous

2 months ago
Responsive CSS Grid Layout
Create a fully responsive grid layout using CSS Grid. Easily adjust the number of columns for different screen sizes.

Author:
Jaxon Green

4 months ago
Feature Card Grid Layout
A clean, responsive grid layout showcasing product or service features with icon illustrations and descriptive text.

Author:
MD. Tayyub

3 months ago
Responsive Feature Grid Cards for Modern Websites
Showcase your product's key features with these responsive grid layout cards. Perfect for highlighting services, benefits, or product specifications on landing pages.

Author:
Morgan

3 months ago
Featured Content Section with Cards
A responsive content section featuring cards with images, headings, and descriptions, perfect for showcasing articles, products, or features on your website.

Author:
Morgan Reynolds

2 months ago
Feature Cards with Hover Effects

Author:
Sammy Rodriguez

3 months ago

Didn't find component you were looking for?

Search from 500+ components