---
title: "MosaicReveal — Framer component · Best of Framer"
description: "$10.00 · Framer component · by Hamim Reza · Sections. MosaicReveal is a feature showcase component for Framer that reveals images through animated geometric clip-path patterns, bars, mosaic…"
canonical: "https://framer.elliotli.dev/component/mosaicreveal"
---

[Home](/)/[Components](/components)/[Sections](/components/category/sections)/MosaicReveal

# MosaicReveal

Animated mosaic showcase

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

![MosaicReveal preview image 1](https://framer.elliotli.dev/og/component/mosaicreveal/e707c17afe07039a/1600x1200.jpg)

## Summary

MosaicReveal is a feature showcase component for Framer that reveals images through animated geometric clip-path patterns, bars, mosaic tiles, or a grid, not a basic directional…

## Description

MosaicReveal is a feature showcase component for Framer that reveals images through animated geometric clip-path patterns, bars, mosaic tiles, or a grid, not a basic directional wipe or fade.

A numbered list lets visitors hover, focus, or click through your items. Each selection swaps the image behind a fresh burst of animated shapes that scale in with staggered timing, then settle into a subtle breathing pulse.

### **WHAT IT DOES**

Add items, each with a title, image, and reveal pattern: bars, mosaic, or grid. Visitors browse the numbered list on one side; hovering or clicking any item triggers the reveal on the other side, built from real SVG clip-path shapes, not a single mask.

### **KEY FEATURES**

-   Three distinct clip-path reveal patterns: bars, mosaic tiling, and grid
    
-   Per-item pattern selection, mix reveal styles across your list
    
-   Staggered shape entrance on every selection change
    
-   Idle breathing pulse once the entrance settles
    
-   Numbered index navigation, hover, focus, and click support
    
-   Optional auto-rotate with configurable interval
    
-   Fully responsive, list and image reflow on smaller screens
    
-   Full color controls, accent, active text, inactive text, background
    
-   Viewport-aware, only animates once scrolled into view
    
-   Static-safe rendering for canvas and thumbnails
    
-   Minimal dependencies, built on Framer Motion
    

### **WHY IT WORKS**

Most reveal components do one thing: wipe or fade an image into view from a direction. MosaicReveal builds the reveal from real geometric shapes with staggered choreography, so a features section feels art-directed instead of templated.

### **PERFECT FOR**

Agency service sections, product feature showcases, portfolio highlights, and any Framer site pairing a numbered list with a visual that changes on selection.

### **WHAT'S INCLUDED**

A single drop-in component. Add items with title, image, and pattern choice, then tune colors, typography, and auto-rotate timing through property controls.

Drop it in, load your items, and let the shapes do the revealing.

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

-   All · #8007

## Details

- **Author**: Hamim Reza
- **Price**: $10.00
- **Published**: 2026-08-31
- **Updated**: 2026-08-31
- **Added**: 2026-08-31
- **Categories**: Sections

## More like this

-   [Project Index](/component/project-index) — Bernardo Lickfold · Free — Editorial index: hover & scroll
-   [Face Parade](/component/face-parade) — RAjan · Free — Animated team profiles
-   [Staircase Cover Flow](/component/staircase-cover-flow) — Karim Saif · $7 — editorial-inspired image gallery
-   [In Their Words](/component/in-their-words) — Majed Monem · $9 — A wall of customer quotes