---
title: "3D Scroll Images — Free Framer component · Best of Framer"
description: "Free Framer component · by Expert & UI/UX Designer | High-Performance Websites · Text. Rotating Scroll Gallery Component"
canonical: "https://framer.elliotli.dev/component/3d-scroll-images"
---

[Home](/)/[Components](/components)/[Text](/components/category/text)/3D Scroll Images

# 3D Scroll Images

Rotating Scroll Gallery Component

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

![3D Scroll Images preview image 1](https://framer.elliotli.dev/og/component/3d-scroll-images/1c9f888e02f34b10/1600x1200.jpg)

## Summary

Rotating Scroll Gallery Component

## Description

An advanced, high-performance Framer code component recreating the interactive "Rotating On-Scroll Animations" effect. It features multiple 3D perspective scroll variations, per-item image management, customizable marquee text strips with precise color blending, and responsive layout styling.

-   **5 Unique Animation Variations:**
    
    1.  _Sine Drift:_ Smooth sinusoidal 3D multi-axis rotation and depth scaling.
        
    2.  _Deep Flip:_ Pronounced 3D flips and depth displacement.
        
    3.  _Slide & Fade:_ Clean vertical-axis rotation with dynamic saturation and brightness filters.
        
    4.  _Velocity Blur:_ Motion-reactive directional blur driven by scroll speed.
        
    5.  _Hold & Squash:_ Center-paused squash-and-stretch perspective transitions.
        
-   **Dynamic Text-to-Image Blending:** Implements native CSS `mix-blend-mode: difference` paired with tuned typography color configurations (`rgb(190,175,110)` in default themes) to achieve precise color inversion and visual integration over overlapping images, exactly matching professional design layouts.
    
-   **Customizable Marquee Header:** Sticky, infinitely translating banner text with user-definable content strings, speeds, font styles, and sizing.
    
-   **Auto Theme System:** Built-in design presets per variation that automatically handle background tones, item aspect ratios, sizing, and blend setups with an option for manual overrides.
    

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

-   All · #3344

## Details

- **Author**: Expert & UI/UX Designer | High-Performance Websites
- **Published**: 2026-07-30
- **Updated**: 2026-07-30
- **Added**: 2026-07-30
- **Categories**: Text

## More like this

-   [Text Reveal Effect](/component/text-reveal-effect) — Lera · $4 — Text reveal effect over "ghost" layer.
-   [Soft Heading](/component/soft-heading) — Kaisa A · Free — Animated Soft Heading in 2 colors
-   [Curved Text Marquee](/component/curved-text-marquee) — Ahmet Loca · Free — Animated Bend
-   [Type Write Effect](/component/type-write-effect) — Russet Supply · Free — Animated Text & Interactive Typing