---
title: "Diagonal Slider Pro — Framer component · Best of Framer"
description: "$6.00 · Framer component · by Shouvik Biswas · Carousels. Diagonal Parallax Carousel"
canonical: "https://framer.elliotli.dev/component/diagonal-slider-pro"
---

[Home](/)/[Components](/components)/[Carousels](/components/category/carousels)/Diagonal Slider Pro

# Diagonal Slider Pro

Diagonal Parallax Carousel

[View on Framer](https://framer.com/marketplace/components/diagonal-slider-pro/?via=elliot-li)

![Diagonal Slider Pro preview image 1](https://framer.elliotli.dev/og/component/diagonal-slider-pro/9924ca50c04302b0/1600x1200.jpg)

## Summary

Diagonal Parallax Carousel

## Description

A highly customizable infinite carousel designed to arrange media along a diagonal spatial axis and create fluid, depth-driven layout transitions.

## Features

-   Independent active and peripheral card dimension inputs for structuring precise hierarchical depth.
    
-   Distinct active and inactive gap parameters for tuning the spatial rhythm between focal and secondary assets.
    
-   Configurable inner parallax intensity for heightening depth perception during horizontal panning.
    
-   Proportional side-card opacity fading for drawing immediate visual focus to the central asset.
    
-   Integrated autoplay with configurable intervals and reversible direction for autonomous layout pacing.
    
-   Hover-pause interaction triggers for uninterrupted asset inspection during active engagement.
    
-   Modular arrow positioning systems with custom asset overrides for tailored navigation ergonomics.
    
-   Flexible pagination coordinate controls for strict alignment with global interface patterns.
    
-   Configurable Framer spring physics for granular control over navigation damping and interaction speed.
    
-   Native layout overflow toggles for containing spatial elements or allowing full-viewport edge bleeding.
    
-   Built-in keyboard arrow event listeners for accessible, frictionless desktop navigation.
    

## How to Use

-   Place the component onto your canvas and add your visual assets via the images array.
    
-   Calibrate card dimensions, side card scaling, and spatial gaps to establish your diagonal hierarchy.
    
-   Configure parallax intensity, autoplay pacing, and navigation styling to finalize the interaction model.
    
-   Publish your project to take the diagonal spatial gallery live.
    

_Orchestrate infinite diagonal motion across your digital environment._

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

-   All · #5455

## Details

- **Author**: Shouvik Biswas
- **Price**: $6.00
- **Published**: 2026-06-16
- **Updated**: 2026-07-25
- **Added**: 2026-06-16
- **Categories**: Carousels

## More like this

-   [3DCurvedImageMarquee](/component/3dcurvedimagemarquee) — Lera · $4 — Curved perspective double ticker
-   [Orbit Kit Carousel](/component/orbit-kit-carousel) — Khairul Fauzy Khairudin · $12 — 3D drag carousel with inertia
-   [Team Orbit](/component/team-orbit) — Ali Musa · Free — Interactive Team Showcase
-   [Glow Testimonial](/component/glow-testimonial) — Interface Studio · Free — Testimonials with a Little Glow