Smudge
An interactive component that applies a smudge effect to images when users hover or drag, with customizable strength and size for creative distortion effects.
Make it with Workshop
Build your own component with AI
Description
Smudge creates an interactive canvas where users can distort images using a smudge effect. The component works by manipulating image pixels in real-time as users interact with it. The effect creates a liquid-like distortion that follows the cursor or touch input, similar to smudge tools in photo editing software.
Use Cases
1. Interactive Galleries - Add playful interaction to image displays
2. Creative Portfolios - Showcase photography with artistic manipulation
3. Product Exploration - Create engaging product image interactions
4. Artistic Websites - Add unique visual effects to image content
5. Educational Tools - Demonstrate image manipulation concepts
Customizations
• Image Source - Any image to apply the smudge effect to
• Interaction Mode - Choose between hover or drag-based interaction
• Smudge Strength - Adjust the intensity of the distortion effect
• Smudge Size - Control the radius of the affected area
• Responsive Design - Adapts to container dimensions
