---
title: "Rack Focus Scroll — Framer component · Best of Framer"
description: "$4.00 · Framer component · by Jamie de Rooij · Galleries. Mimicking the camera rack focus"
canonical: "https://framer.elliotli.dev/component/rack-focus-scroll"
---

[Home](/)/[Components](/components)/[Galleries](/components/category/galleries)/Rack Focus Scroll

# Rack Focus Scroll

Mimicking the camera rack focus

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

![Rack Focus Scroll preview image 1](https://framer.elliotli.dev/og/component/rack-focus-scroll/ef933d70cf89fc04/1600x1200.jpg)

## Summary

Mimicking the camera rack focus

## Description

## **Rack Focus Gallery**

**_Scroll through your photos like a cinematographer racking focus between subjects, no keyframes, no timeline, just scroll._**

Drop in your photos, and each one gets its own moment: fully sharp, then a smooth rack-focus pull carries the eye into the next. Subjects don't cut, they resolve into each other, the way a lens shifts focus between a foreground and background subject.

It doesn't cut, it racks. Most scroll galleries swap images with a hard cut or a flat crossfade. This one blurs and fades in the same breath your eye would take refocusing between two things in a room, softening out, sharpening in.

Control how long each photo holds tack-sharp versus how much of the scroll is spent racking to the next, so you can build anything from a snappy slideshow feel to a slow, cinematic dissolve.

### **Full customization**

**Photos**

-   Photos: the order you add them is the order they play in the scroll, no depth values to configure
    

**Pacing**

-   Vh Per Photo — scroll distance dedicated to each photo (50–300); total section length scales automatically with photo count
    
-   Hold Amount: how much of each photo's segment it stays perfectly sharp versus racking to the next (0–0.9)
    
-   Blur Amount — maximum defocus applied to out-of-focus photos (0–40px)
    
-   Velocity Sensitivity — how strongly scroll speed feeds into extra blur (0–0.01)
    
-   Max Whip Blur — ceiling on that speed-driven blur kick (0–30px)
    
-   Spring Stiffness / Spring Damping, the physical feel of the focus pull itself; higher stiffness and lower damping make it snappier and springier, the reverse makes it slower and more settled
    

**Text overlay (optional, toggled on/off)**

-   Show Text — turns the whole caption block on or off
    
-   Position — 3×3 grid placement (top/middle/bottom × left/center/right)
    
-   Text Gap — spacing between title and description
    
-   Title — text input (font styling)
    
-   Description text input (font styling)
    
-   Overlay Opacity — strength of the black scrim behind the text, for legibility over any photo
    

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

-   All · #1325

## Details

- **Author**: Jamie de Rooij
- **Price**: $4.00
- **Published**: 2026-08-03
- **Updated**: 2026-08-03
- **Added**: 2026-08-03
- **Categories**: Galleries

## More like this

-   [Infinite Pan Canvas](/component/infinite-pan-canvas) — Aisol Studio · $15 — Endless image wall you can drag
-   [CMS Photo Pile](/component/cms-photo-pile) — Marso Angelov · $10 — Draggable Photo Gallery
-   [CMS Infinity Grid](/component/cms-infinity-grid) — 55N · Free — Boundless exploration.
-   [Endless CMS Reel](/component/endless-cms-reel) — Marso Angelov · $10 — Horizontal Momentum Gallery