Radiant Text

A glare effect on text.

Install using CLI

npm
pnpm
bun
yarn
npx shadcn-vue@latest add "https://inspira-ui.com/r/radiant-text.json"

Install Manually

Copy and paste the following code

RadiantText.vue

API

Prop NameTypeDefaultDescription
durationnumber10Duration of the animation in seconds.
radiantWidthnumber100Width of the radiant animation.

Credits

  • Credits to Magic UI for this fantastic component.
Number Ticker
Animate numbers to count up or down to a target number
Sparkles Text
A dynamic text that generates continuous sparkles with smooth transitions, perfect for highlighting text with animated stars.