---
title: "Hover Reveal Tabs — Framer component · Best of Framer"
description: "$5.00 · Framer component · by Russet Supply · Navigation. Interactive Row & Revealing Image"
canonical: "https://framer.elliotli.dev/component/hover-reveal-tabs"
---

[Home](/)/[Components](/components)/[Navigation](/components/category/navigation)/Hover Reveal Tabs

# Hover Reveal Tabs

Interactive Row & Revealing Image

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

![Hover Reveal Tabs preview image 1](https://framer.elliotli.dev/og/component/hover-reveal-tabs/0616a3a4aec52692/1600x1200.jpg)

## Summary

Interactive Row & Revealing Image

## Description

[Live Preview](https://hoverrevealtabs.framer.website/)

[Grab more components for free](https://www.framer.com/@design-by-saqlain/)

Flow Reveal Rows is a polished Framer component that pairs a structured list of content with a dynamic visual panel. As users move between rows, the shared highlight smoothly follows the active item while its corresponding image transitions into view. Each row can also include its own link and optional new-tab behavior.

### **Features**

-   Dynamic visual reveal for each row
    
-   Smooth shared active-row indicator
    
-   Directional image transitions
    
-   Upload images or use direct image URLs
    
-   Custom numbers, titles, and icons
    
-   Individual links with new-tab support
    
-   Fully responsive mobile layout
    
-   Custom mobile breakpoint
    
-   Touch-friendly mobile interaction
    
-   Static-renderer optimized for Framer
    
-   Custom hover and image transitions
    

### **Fully Customizable**

Build the component around your brand with complete control over typography, spacing, colors, sizing, icons, image layout, borders, and animation behavior.

### **Customize**

-   Row content, images, links, and numbering
    
-   Image width, height, radius, and spacing
    
-   Row height, padding, spacing, and number-to-title gap
    
-   Title and number typography
    
-   Background, text, active text, highlight, and divider colors
    
-   Icon style, weight, size, and rotation
    
-   Hover and image transition settings
    
-   Mobile breakpoint and responsive image height
    

### **How It Works**

Each row is connected to its own visual. Moving across the list activates the corresponding row, slides the shared highlight into position, and transitions the matching image into the preview area. The transition direction follows the user's movement through the list, creating a fluid, connected browsing experience. On mobile, the layout automatically switches to a stacked, touch-friendly experience.

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

-   All · #3397

## Details

- **Author**: Russet Supply
- **Price**: $5.00
- **Published**: 2026-08-13
- **Updated**: 2026-10-15
- **Added**: 2026-08-13
- **Categories**: Navigation

## More like this

-   [Reveal Navigations](/component/reveal-navigations) — Design Supply · Free — A calmer way to open your menu
-   [Collapsible Sidebar](/component/collapsible-sidebar) — Marso Angelov · $10 — Responsive Side Navigation
-   [Dial Picker](/component/dial-picker) — Tanmay Kaper · $14 — A machined dial for your projects
-   [Expanding Side Menu](/component/expanding-side-menu) — Russet Supply · $5 — Animated Framer Navigation