Dimensional Switch Slider

Component 247

About

3D card-flip carousel with directional text transitions, configurable horizontal or vertical flip axis, custom easing, autoplay and pagination.

Built with React and Tailwind. Copy the prompt and paste it into Claude Code, Cursor or Lovable: your agent adds Dimensional Switch Slider to your project and fits it to your theme.

Code

How Dimensional Switch Slider is used: the demo's code. The component's own source comes with a free account.

Usage.tsx

"use client";

import DimensionalSwitchSlider from "@/components/ui/dimensional-switch-slider";

export default function DimensionalSwitchSliderDemo() {
  return (
    <div className="w-full h-screen bg-neutral-950">
      <DimensionalSwitchSlider
        infinite
        direction="horizontal"
        autoplay
        autoplayDelay={2600}
        textColor="#ffffff"
        textSize={84}
        cardWidth={680}
        cardHeight={460}
        cardBorderRadius={16}
      />
    </div>
  );
}