Animated Border Trail
Animated Border Trail is a React and Tailwind CSS text component from Motion Primitives, licensed MIT. Copy it and paste it into your project.
Motion Primitives
MIT
text
What it is
Animated Border Trail is a React and Tailwind CSS text component from Motion Primitives, licensed MIT. Copy it and paste it into your project.
How to use it
Open it in the catalogue, press copy, and paste it into your project. The prompt you copy carries the code and the rules that tell your agent to reproduce it without changing anything.
Four free copies a week. No card.
No packages beyond the project baseline
Licence
This component comes from Motion Primitives and is redistributed under the MIT licence, which permits commercial use. The copyright notice travels with the code.
Animated Border Trail
import { BorderTrail } from '@/components/core/border-trail';
export function BorderTrailTextarea() {
return (
<div className='relative h-[160px] w-[260px] overflow-hidden rounded-md border border-zinc-950/10 bg-white text-zinc-700 outline-hidden dark:border-zinc-50/20 dark:bg-zinc-950 dark:text-zinc-300'>
<textarea className='h-full w-full resize-none rounded-md bg-transparent px-4 py-3 text-sm outline-hidden' />
<BorderTrail
className='bg-linear-to-l from-blue-200 via-blue-500 to-blue-200 dark:from-blue-400 dark:via-blue-500 dark:to-blue-700'
size={120}
/>
</div>
);
}