rocketmxn ui logo|
Components

Make your websites classy and immersive.

A collection of lightweight UI components crafted with Tailwind CSS and shadcn/ui for modern React and Next.js applications.

Now updated for Tailwind CSS 4.0!New
TailwindCSSTailwindCSS
Motion
Shadcn UIshadcn/ui
Next.js
React
Strip Gallery
Starfield Background

In a galaxy, far far away!

Bubble Background

Bubbles respond to scroll

Copy & Paste Ready

Every component is ready to be copied directly into your project.

Fully Customizable

Tailwind-based styling that’s easy to modify and extend.

Interactive Elements

Smooth animations and transitions built-in.

export default function BlurText({
  text,
  className = "",
  minBlurPx = 2,
  maxBlurPx = 18,
  minDelay = 0,
  maxDelay = 1,
  minDur = 0.1,
  maxDur = 1,
}: Props) {
  const chars = React.useMemo(() => Array.from(text), [text]);

  // Viewport gate — play once when any part becomes visible
  const rootRef = React.useRef<HTMLDivElement | null>(null);
  const isInView = useInView(rootRef, {
    once: true,
    margin: "0px 0px -20% 0px",
  });

  const lens = React.useMemo(() => {