---
title: "Bento Section — Framer component · Best of Framer"
description: "$4.00 · Framer component · by Ahmet Loca · Sections. bento section, image tile grid"
canonical: "https://framer.elliotli.dev/component/bento-section"
---

[Home](/)/[Components](/components)/[Sections](/components/category/sections)/Bento Section

# Bento Section

Bento Grid Gallery With Flip Cards

[View on Framer](https://framer.com/marketplace/components/bento-section/?via=elliot-li)

![Bento Section preview image 1](https://framer.elliotli.dev/og/component/bento-section/7693ec801b892522/1600x1200.jpg)

## Summary

bento section, image tile grid

## Description

**MORE FRAMER COMPONENTS LIKE THIS**

**✦ Browse +38 FREE + 85 premium components:** [https://frameze.com/components](https://frameze.com/components)

**✦ Get everything for one price:** [https://ahmetloca.dub.link/allcomponents](https://ahmetloca.dub.link/allcomponents)

## **About Bento Grid Gallery**

BentoSection is an interactive bento grid gallery for Framer. Tiles are arranged in a true bento layout with custom column and row spans, and each one flips in 3D on click to reveal extended text on the back. The grid auto-adjusts its column count as the container resizes, so the layout always stays clean on any screen size. Fully responsive, keyboard accessible and built for portfolios, agencies and product pages.

**Features**

3D flip-card reveal — click any tile to show its back face

True bento grid — custom column & row spans per tile

Auto-responsive grid — switches from 12 to 6 to 1 columns by width

Native Framer font picker for title & body text

Custom two-color gradient for the flipped back face

Smooth hover image zoom on every tile

Keyboard accessible — visible focus ring, Tab + Enter/Space support

Mobile-friendly — flip toggle always visible on narrow screens

Add up to 20 tiles with the built-in array control

Lazy-loaded images for fast page performance

Adjustable border radius, gap, row height and accent color Full property controls: fonts, colors, sizes, radius, gap and more Works out of the box — no setup needed

**Use Cases**

Portfolio & personal branding websites

Creative agency & studio pages

Travel, park & outdoor brand websites

Product showcase & feature grid sections

Photography & visual storytelling sites

SaaS marketing & feature highlight pages

Real estate & interior design portfolios

Restaurant & menu showcase pages

**Keywords**

bento grid, bento grid, flip card gallery, flip card component, hover reveal card, interactive grid, image grid hover, card flip animation, responsive bento grid, framer grid component, gallery flip card, bento layout, grid gallery hover, click reveal card, framer bento section, image tile grid

## Rank history [How rankings work →](/terms#rankings)

-   All · #3799

## Details

- **Author**: Ahmet Loca
- **Price**: $4.00
- **Published**: 2026-07-18
- **Updated**: 2026-09-30
- **Added**: 2026-07-18
- **Categories**: Sections

## More like this

-   [Velours Index](/component/velours-index) — Hamim Reza · $10 — Hover a title, reveal the film
-   [BlogSingleX Single](/component/blogsinglex-single) — Themomarket · $8 — Single Blog Details Component
-   [Slanted Cascade Cove](/component/slanted-cascade-cove) — Karim Saif · Free — Diagonal photo gallery
-   [Voice Testimonials](/component/voice-testimonials) — valorsic studio · $15 — Voiceover & typewriter reviews