Highlighted Text

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

Highlighted Text Effect

"use client";

import { HighlightedText } from "@/components/vritti/highlighted-text";

export function HighlightedTextExample() {
  return (
    <div className="flex items-center justify-center p-8">
      <HighlightedText>Highlighted Text Effect</HighlightedText>
    </div>
  );
}

Installation


pnpm dlx shadcn@latest add "https://vritti.thesatyajit.com/r/highlighted-text"

Dependencies


pnpm add motion