Text Shimmer

Light shimmer that sweeps across text. Configurable speed, color, and background. Pure CSS animation.

Shimmering text effectparticleui.dev

Code

import { TextShimmer } from "@/components/ui/text-shimmer"

export default function Example() {
  return (
    <TextShimmer
      text="Shimmering text effect"
      className="text-3xl font-bold"
      duration={2000}
    />
  )
}

Installation

$npx particleui-cli add text-shimmer

Usage

TSX

import { TextShimmer } from "@/components/ui/text-shimmer"

export default function Example() {
  return (
    <TextShimmer
      text="Shimmering text effect"
      className="text-3xl font-bold"
      duration={2000}
    />
  )
}

Props

Prop	Type	Default	Required
text	string	—	yes
className	string	—	no
duration	number	`2000`	no

Details

Source filecomponents/ui/text-shimmer.tsx

Typeui

Categoriestext, particles

npm dependencies

Registry deps

Claude skill—