Whitestripes

Dynamic motion background for hero sections and modern layouts.

Interface Is the Product.

Installation

npx scrollx-ui@latest add whitestripes

Usage

import WhiteStripes from "@/components/ui/whitestripes";

<WhiteStripes>
  <div className="text-center space-y-6">
      <h1 className="text-5xl md:text-6xl font-extrabold leading-tight text-stroke-light">
        Interface Is the Product.
      </h1>
    </div>
  </WhiteStripes>

API Reference

WhiteStripes

The WhiteStripes component provides a smooth, animated striped background ideal for use in modern hero sections, landing pages, or immersive UI experiences. It loops continuously and adapts to light and dark themes.

Props

className (string) – Optional additional Tailwind or custom classes to modify the container’s styling.
children (React.ReactNode) – Optional content to render centered above the animated background (like text or call-to-actions).