MosaicReveal

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…

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.

Animated mosaic showcase