Draw Line Text Animation

A smooth text effect that draws characters as strokes and fills them in, perfect for headers and highlights.

Perfect for headers and highlights.

Pumki UI

Installation

Usage

1import { DrawLineText } from '@/components/pumki-ui/text/draw-line-text';

1<DrawLineText
2      className="font-medium"
3      fontSize={60}
4      strokeWidth={1.5}
5      text="Ansh Singh Snkhia"
6      color="var(--color-foreground)"
7  />

Examples

At once

Set `oneByOne` to `false` to animate all characters together without any stagger.