Project Scroll Rail

Project Scroll Rail
Project Scroll Rail

About Project Scroll Rail

Project Scroll Rail is a scroll-driven portfolio section for Framer. Project cards glide over full-screen, pinned background photos, and each photo drifts with a soft parallax and brightens as it comes into view. Made for interior designers, architects, real estate, agencies, studios and creative portfolio websites.

Key features:

  • Scroll-linked card rail: cards move 1:1 with the page, no lag

  • Parallax background images with a scroll brightness reveal

  • Built-in smooth scroll (Lenis-style), no extra component needed

  • Up to 10 projects, each with title, card image, background, link and tag

  • Custom labels: up to 20 detail rows like Location, Services, Year, Budget or Area

  • Card Align: left, center or right

  • Navigation dots with a 01 / 05 counter, click to jump to any project

  • Card controls: width, radius, image radius, shadow, show or hide image, hide empty rows, H2 / H3 / H4 heading for SEO

  • Backdrop controls: color overlay, parallax amount, minimum brightness, easing

  • Hover lift with image zoom, plus a focus mode that dims inactive cards

  • Optional "View Project" link text, open in new tab, and a Tap event for Framer interactions

  • Full font and color control for every text

Performance and quality:

  • No GSAP, no external scripts, fonts or image links

  • Animations pause when the section is off screen

  • Motion runs on desktop. Tablet and mobile get a clean stacked layout

  • Respects reduced motion settings

  • Accessible, keyboard-friendly navigation

How to use: drop the component on your page, add your projects, upload images, set your labels and fill in the values. Edit everything in the property panel, no code needed.

Keywords: framer portfolio, project showcase, parallax scroll, scroll animation, sticky scroll section, case study cards, interior design website, architecture portfolio, real estate listing, smooth scroll, framer component, scroll cards