Image Ripple Effect

WebGL-powered cursor ripples that displace layered image cards in real time.

Library

Componentry

Framework

React

Type

component

License

MIT

Install

npx shadcn@latest add @componentry/image-ripple-effect

Files

• packages/ui/src/components/image-ripple-effect.tsx
• packages/ui/src/lib/utils.ts
• packages/ui/src/components/webgl-error-boundary.tsx

Source

https://github.com/harshjdhv/componentry

Categories

• Effect Components
• React Effect Components
• Tailwind CSS Effect Components
• Animated Effect Components
• Image Effect Components
• React Image Effect Components
• Tailwind CSS Image Effect Components
• Animated Image Effect Components

More from Componentry

• Ascii Effect
• Dithered Logo
• Hover Transition
• Pixel Image Trail
• Animated Gradient
• Annotated Text
• Aurora Flow
• Autocomplete
• Case Study Flip Stack
• Circuit Board
• Closing Plasma
• Collection Surfer