Ripple

A component that creates expanding ripple circles with customizable size, opacity, and number of circles.

Library

Animations (Svelte)

Framework

Svelte

Type

block

License

MIT

Install

pnpm dlx shadcn-svelte@latest add https://sv-animations.vercel.app/r/ripple.json

Files

• src/lib/components/magic/ripple/ripple.svelte
• src/lib/components/magic/ripple/index.ts
• src/lib/utils.ts

Source

https://github.com/SikandarJODD/animations

Categories

• Backdrop Components
• Svelte Backdrop Components
• Tailwind CSS Backdrop Components
• Animated Backdrop Components
• Pattern Background Components
• Svelte Pattern Background Components
• Tailwind CSS Pattern Background Components
• Animated Pattern Background Components

More from Animations (Svelte)

• Animated Grid Pattern
• Dot Pattern
• Flickering Grid
• Glyph Matrix
• Grid Pattern
• Hexagon Pattern
• Motion Grid
• Retro Grid
• Striped Pattern
• Animated Background
• Animated Beam
• Animated Circular Progress Bar