Gradual Spacing

Text 311

About

Word animation for gradual spacing between letters

Built with React and Tailwind. Copy the prompt and paste it into Claude Code, Cursor or Lovable: your agent adds Gradual Spacing to your project and fits it to your theme.

Code

How Gradual Spacing is used: the demo's code. The component's own source comes with a free account.

Usage.tsx

import { GradualSpacing } from "@/components/ui/gradual-spacing"

export function GradualSpacingDemo() {
  return (
    <GradualSpacing
      className="font-display text-center text-4xl font-bold -tracking-widest  text-black dark:text-white md:text-7xl md:leading-[5rem]"
      text="Gradual Spacing"
    />
  );
}