Warp Background

import { WarpBackground } from "@/components/ui/warp-background"

export default function Example() {
  return (
    <WarpBackground>
      <div className="w-80">
        <h2>Warp Background</h2>
        <p>This component creates a warp background effect.</p>
      </div>
    </WarpBackground>
  )
}

import { WarpBackground } from "@/components/ui/warp-background"

export default function Example() {
  return (
    <WarpBackground
      perspective={150}
      beamsPerSide={5}
      beamSize={4}
      beamDuration={4}
    >
      <div className="w-80">
        <h2>Custom Warp Effect</h2>
        <p>Adjust the perspective and beam properties.</p>
      </div>
    </WarpBackground>
  )
}