Render text with a fluid gradient that shifts with pointer movement.
Features
- Gradient shifts with horizontal pointer movement for an interactive text effect.
- Smooth transitions keep the effect natural while moving across the text.
svgViewBoxWidthandsvgViewBoxHeightlet you tune text scale for different layouts.
Installation
$ pnpm dlx shadcn@latest add @ncdai/fluid-gradient-text
Usage
import { FluidGradientText } from "@/components/fluid-gradient-text"<FluidGradientText text="shadcn" />API Reference
FluidGradientText
Prop
Type
References
- Vercel Design — inspiration for this text gradient interaction.