Svelte Text Components

Dev Design Library indexes 45 Svelte text components from 4 open-source UI libraries, with the most coming from Animations (Svelte), cnblocks, AI Elements (Svelte) and Canvas UI. 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.

• Decrypt RevealCanvas UI · ReactUI encrypted into ASCII, decoded by the cursor.
• Content Fivecnblocks · SvelteContent block with image and text in grid layout
• Animated Gradient TextAnimations (Svelte) · SvelteAn animated gradient background which transitions between colors for text.
• ResponseAI Elements (Svelte) · SvelteA markdown response renderer for streamed AI content.
• Content Fourcnblocks · SvelteContent section with feature highlights
• Animated Shiny TextAnimations (Svelte) · SvelteA shimmering text effect component that creates a moving shine animation across text.
• ShimmerAI Elements (Svelte) · SvelteA text shimmer utility component with configurable spread and duration.
• Content Onecnblocks · SvelteSimple content block with heading and description
• Aurora TextAnimations (Svelte) · SvelteA text component with animated aurora gradient effect that smoothly transitions between customizable colors.
• Content Sevencnblocks · SvelteContent block with alternating layout
• Dia Text RevealAnimations (Svelte) · SvelteA sweeping gradient text reveal with viewport triggering and rotating text support.
• Content Sixcnblocks · SvelteContent section with icons and descriptions
• 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…
• Content Threecnblocks · SvelteTwo-column content with image sidebar
• 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.
• Content Twocnblocks · SvelteContent block with centered text and CTA
• 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 Text HighlighterAnimations (Svelte) · Svelte
• Fancy Underline To BackgroundAnimations (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

Libraries with Svelte text components

• Animations (Svelte)
• cnblocks
• AI Elements (Svelte)
• Canvas UI

Related categories

• Text Components
• React Text Components
• Tailwind CSS Text Components
• Animated Text Components
• shadcn/ui Text Components
• Svelte Animated Text Components
• Svelte Heading Components