Skip to content

component

MosaicFlip

By Paula Sanz

Details

Summary

A grid that flips its tiles in 3D

Description

Mosaic Flip is a portfolio component that transforms your images into a dynamic grid of 3D tiles. On idle, each tile subtly breathes with a randomized depth animation, giving the component a living, organic feel. When a user hovers over a project name in the navigation, the entire grid flips tile by tile in a smooth wave that radiates from the center outward — revealing the next image underneath with a satisfying 3D rotation effect. Built with performance in mind, transitions are handled imperatively to avoid re-renders mid-animation, and a queue system ensures no interaction is ever dropped. The dark side faces of each tile add real depth during the flip, making the transition feel truly three-dimensional. Everything is customizable directly from the Framer canvas — swap images, edit project names, adjust grid columns and rows, tile size, background color, navigation text color, and dark face color. No code needed after dropping it in.

Introduction

A grid that flips its tiles in 3D

Rank history

Daily rank per list, from the first snapshot — lower is better.

12001400157448/148/228/309/79/15
  • All · #5744