Hyperiux Vault

Dimensional Switch Slider

Component 248

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>
  );
}

Dependencies

More by Hyperiux Vault

View all
  • Product Timeline

    Product Timeline

    2.4K
  • Stack Spread

    Stack Spread

    1.3K
  • Arrow Fill Button

    Arrow Fill Button

    940
  • Interactive List Preview

    Interactive List Preview

    880
  • Shiny Button

    Shiny Button

    816
  • Circular Split Roll

    Circular Split Roll

    688
  • Zoom Slider

    Zoom Slider

    460
  • Stack Loader

    Stack Loader

    379