Split Text

Text 136

About

Here is Split Text component

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

Code

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

Usage.tsx

import { TextSplit } from "@/components/ui/split-text";

const TextSplitFalloff = () => {
  return (
    <TextSplit
      className="text-4xl font-medium text-zinc-900 dark:text-zinc-50"
      maxMove={150}
      falloff={0.1}
    >
      Cut through the silence
    </TextSplit>
  );
};

export default TextSplitFalloff;