Iridescent — React Animated Background

import { Iridescent, IRIDESCENT_PRESETS } from "@/components/Iridescent";

export function IridescentHero() {
  return (
    <section style={{ position: "relative", minHeight: "100dvh" }}>
      <Iridescent {...IRIDESCENT_PRESETS.pearl}
        {...{
          interactive: true,
          speed: 0.8,
          scale: 2.4,
          hueShift: 0,
          saturation: 1,
          brightness: 0.9
        }}
      />
      <div style={{ position: "relative", zIndex: 1, padding: "8rem 2rem" }}>
        <h1>Holographic, minus the video</h1>
      </div>
    </section>
  );
}