GitHub
Open Github

Highlighted Text

Text with sliding background highlight animation using mix-blend-mode.

Installation

pnpm dlx shadcn@latest add @spell/highlighted-text

Examples

Direction

Usage

import { HighlightedText } from "@/components/highlighted-text";
<HighlightedText>
  Your text here
</HighlightedText>

Props

PropTypeDefault
children
React.ReactNode
-
from
'left' | 'right' | 'top' | 'bottom'
'bottom'
delay
number
0
inView
boolean
false
className
string
-