Components
Sliced Text
An animated text that splits into two horizontal halves and slices apart on hover.
import SlicedText from "@/components/ui/sliced-text";
export default function SlicedTextDemo() {
return (
<div className="flex min-h-[300px] w-full items-center justify-center bg-background p-8">
<SlicedText
text="Sliced Text"
className="text-6xl font-bold text-foreground"
splitSpacing={4}
/>
</div>
);
}