Hyperiux Vault

Dimensional Switch Slider

Component 234

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.3K
  • Stack Spread

    Stack Spread

    1.3K
  • Arrow Fill Button

    Arrow Fill Button

    912
  • Interactive List Preview

    Interactive List Preview

    869
  • Shiny Button

    Shiny Button

    750
  • Circular Split Roll

    Circular Split Roll

    641
  • Zoom Slider

    Zoom Slider

    430
  • Stack Loader

    Stack Loader

    371