Bling Transition

An image A → B transition with palette-tinted sparkle cores blooming along the wipe boundary — fbm-driven wipe, IQ-palette kaleidoscope sparkles only at the moving edge, ping-pong looping.

Customize

Palette

Direction

Duration4200ms

Hold1800ms

Intensity0.0050

Iterations4

Sparkle1.00

Softness0.22

Distortion0.080

Drip0.55

Auto play

Loop

Usage

import { BlingTransition } from "@/components/lazy-ui/bling-transition";

export function Demo() {
  return (
    <BlingTransition
      imageA="/images/before.jpg"
      imageB="/images/after.jpg"
      palette="iris"
      duration={2400}
      hold={1200}
      intensity={0.005}
      iterations={4}
      sparkleStrength={1}
      softness={0.22}
      distortion={0.08}
      drip={0.55}
      direction="noise"
      className="h-[480px] w-full rounded-2xl"
    />
  );
}