---
title: "Parallax Image 3D — Free Framer component · Best of Framer"
description: "Free Framer component · by Aidan Looker · Effects. What is Parallax Image 3D?"
canonical: "https://framer.elliotli.dev/component/parallax-image-3d"
---

[Home](/)/[Components](/components)/[Effects](/components/category/effects)/Parallax Image 3D

# Parallax Image 3D

Scroll-driven 3D card flip with parallax

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

![Parallax Image 3D preview image 1](https://framer.elliotli.dev/og/component/parallax-image-3d/a1582429679444aa/1600x1200.jpg)

## Summary

What is Parallax Image 3D?

## Description

## What is Parallax Image 3D?

Parallax Image 3D is a scroll-driven 3D card component that flips from a fully customizable back face into an image-rich front face as visitors scroll down the page. It pairs a smooth card flip with true image parallax, dynamic specular lighting, and interactive hover tilt — perfect for product reveals, portfolio showcases, and landing page hero moments where first impressions count.

[![](https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/components/description-image-8vjwbcr2-RQLDut7AgLOovQEwgaJNpNG4n3n3B6)](https://teampixelau.lemonsqueezy.com/checkout/buy/3b016e8d-2ba4-4944-8431-e2c592334df1)

### Core Features

-   Scroll-driven 3D flip animation with adjustable speed and smooth S-curve easing — no click triggers or interaction setup required
    
-   True image parallax on the front face that shifts the background as visitors scroll, creating natural depth and visual richness
    
-   Interactive hover tilt that responds to mouse movement
    
-   Fully customizable back face with gradient colors, optional background image, decorative patterns (dots, grid, diagonal, noise), and editable tagline, hero text, and prompt
    
-   Responsive layout with configurable border radius, text overlay positioning (top, center, bottom), and full Framer font controls for every text element
    

### Controls inside Framer

**Front Face**

-   Front Image
    
-   Title
    
-   Subtitle
    

**Back Face**

-   Color Start / Color End
    
-   Gradient Angle
    
-   Text Color / Accent Color
    
-   Back Image
    
-   Pattern (None, Dots, Grid, Diagonal, Noise)
    
-   Pattern Opacity
    
-   Tagline / Hero Text / Prompt Text
    

**Animation**

-   Flip Speed
    
-   Parallax Depth
    
-   Scroll Tilt
    

**Hover**

-   Tilt on Hover
    
-   Tilt Intensity
    

**Card Style**

-   Border Radius
    
-   Text Overlay Opacity
    
-   Text Position (Bottom, Center, Top)
    
-   Title Color / Subtitle Color
    

**Typography**

-   Title Font
    
-   Subtitle Font
    
-   Back Tagline Font
    
-   Back Hero Text Font
    
-   Back Prompt Font
    

### Best use cases

-   Product reveal cards on e-commerce landing pages and drop announcements
    
-   Portfolio hero sections that unveil featured projects as visitors scroll
    
-   Storytelling blocks on editorial and campaign pages that reward scrolling with cinematic transitions
    
-   Feature highlights on SaaS and app landing pages where depth and motion reinforce a premium brand
    

Drop it onto your canvas, swap the image, edit the text, and publish. A scroll-stopping 3D reveal in under a minute.

## Questions or custom requests?

-   We design and build custom Framer components. Get in touch at [contact@teampixel.com.au](mailto:contact@teampixel.com.au).
    

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

-   All · #3922

## Details

- **Author**: Aidan Looker
- **Published**: 2026-03-05
- **Updated**: 2026-06-13
- **Added**: 2026-03-01
- **Categories**: Effects

## More like this

-   [Particle Image](/component/particle-image) — Jamik · $12 — Logos and photos as 3D points
-   [Ascii Portrait](/component/ascii-portrait) — The Black Sheep · Free — Photos that dissolve into ASCII
-   [Sandfall](/component/sandfall) — Cyedi Creative Studio · $5 — Your headline, buried in coloured
-   [Still Water](/component/still-water) — DariStudio · $9 — Water ripples over any photo
