About this Component
Create a fluid, watercolor-inspired background with soft color blending, organic movement, and subtle texture. Watercolor Shader adds an atmospheric animated surface to hero sections, landing pages, portfolios, and experimental layouts.
Choose a ready-made theme or build your own palette, then fine-tune the motion and texture to create anything from a calm ambient background to a more expressive interactive effect.
How to use
Drop the component into your layout and resize it to cover the desired area. Choose a light, dark, or custom theme, then adjust the primary and secondary colors from the properties panel.
Control the animation using speed, detail, and grain settings. Enable interaction to let the shader respond to pointer movement, and optionally add Ripple, Bloom, or Twist effects when visitors click.
Features
Animated watercolor-style shader background
Light, dark, and custom themes
Custom primary and secondary colors
Adjustable animation speed
Detail and grain controls
Optional pointer interaction
Adjustable warp strength and radius
Ripple, Bloom, and Twist click effects
Works as a section, frame, or full-page background
Responsive across desktop, tablet, and mobile
No setup or coding required
