Svelte Animated Text Components
Dev Design Library indexes 34 Svelte animated text components from 3 open-source UI libraries, with the most coming from Animations (Svelte), Canvas UI and AI Elements (Svelte). Each one links to its page with the source code, a live preview where available, the library license and the install command. Every library in this list targets Svelte. Animated text components belong to the Text group.
Decrypt RevealCanvas UI · ReactUI encrypted into ASCII, decoded by the cursor.
Animated Gradient TextAnimations (Svelte) · SvelteAn animated gradient background which transitions between colors for text.
ShimmerAI Elements (Svelte) · SvelteA text shimmer utility component with configurable spread and duration.
Animated Shiny TextAnimations (Svelte) · SvelteA shimmering text effect component that creates a moving shine animation across text.
Aurora TextAnimations (Svelte) · SvelteA text component with animated aurora gradient effect that smoothly transitions between customizable colors.
Fancy Letter Swap Ping PongAnimations (Svelte) · SvelteText whose letters slide out and are replaced by a copy on hover, one after another, and go back when the pointer…
Fancy Random Letter Swap Ping PongAnimations (Svelte) · SvelteText whose letters slide out and are replaced by a copy on hover in random order, and go back when the pointer leaves.
Fancy Scramble HoverAnimations (Svelte) · SvelteText whose characters scramble through random glyphs while the pointer is over it.
Fancy Scramble InAnimations (Svelte) · SvelteText that appears by scrambling random characters that resolve into the real letters from left to right.
Fancy Text Along PathAnimations (Svelte) · SvelteText laid along an SVG path that moves along the curve, in a loop or with the scroll.
Fancy Text RotateAnimations (Svelte) · SvelteText slot that rotates through a list of words, each one sliding out as the next slides in.
Hyper TextAnimations (Svelte) · SvelteAn animated text component that creates a glitch effect by cycling through random characters before revealing the…
Line Shadow TextAnimations (Svelte) · SvelteA text component with an animated diagonal line shadow effect that moves across the text.
Morphing TextAnimations (Svelte) · SvelteA text component that smoothly morphs between multiple text strings with a blur transition effect.
Sparkles TextAnimations (Svelte) · SvelteA dynamic text that generates continuous sparkles with smooth transitions, perfect for highlighting text with animated…
Spell Slide Up TextAnimations (Svelte) · SvelteText that slides up into view from behind a mask.
Spell Words StaggerAnimations (Svelte) · SvelteText whose words appear one after another with a short delay.
Stagger TextAnimations (Svelte) · SvelteAn interactive text component where characters animate vertically on hover with a staggered delay effect.
Text AnimateAnimations (Svelte) · SvelteAnimate text with various effects like blur, slide, scale, and fade with granular control over words, characters, or…
Typing AnimationAnimations (Svelte) · SvelteA typewriter effect component that types out text with customizable speed, cursor styles, and support for cycling…
Video TextAnimations (Svelte) · SvelteA component that displays video content masked by text, creating a text-shaped video effect with customizable…
Word RotateAnimations (Svelte) · SvelteA component that cycles through an array of words with smooth fade and slide animations between transitions.
Fancy Letter 3D SwapAnimations (Svelte) · Svelte
Fancy Letter SwapAnimations (Svelte) · Svelte
Fancy Media Between TextAnimations (Svelte) · Svelte
Fancy Random Letter SwapAnimations (Svelte) · Svelte
Fancy Vertical Cut RevealAnimations (Svelte) · Svelte
Spell Blur RevealAnimations (Svelte) · Svelte
Spell Gradient Wave TextAnimations (Svelte) · Svelte
Spell Highlighted TextAnimations (Svelte) · Svelte
Spell Randomized TextAnimations (Svelte) · Svelte
Spell SignatureAnimations (Svelte) · Svelte
Spell Special TextAnimations (Svelte) · Svelte
Spell Text MarqueeAnimations (Svelte) · Svelte