Free tool · beUI Studio · Light
Animated Caustics Background
Rippling light patterns like sunlight through water. Caustics add a clean, refreshing shimmer that works in light themes as well as dark.
Design it in your browser, tune the colors and motion, and export it as React source, a PNG, or a WebM video.
Where it works
- Travel, hospitality, and water-related brands
- Summer campaigns and seasonal landing pages
- Light-mode hero sections
Tip: Use blues and teals with a pale base for a pool-light look, or warm tones for a sunset feel.
Make it yours
Pick your own palette, then adjust the shader and finish. Stack effects on top for a retro, glitch, or print look.
Settings
- Speed
- Scale
- Detail
- Distortion
- Glow
- Grain
- Vignette
- Brightness
- Contrast
- Saturation
- Hue
Effects
- Pixelate
- Dither
- Posterize
- Edge glow
- Pixel sort
- LED
- RGB split
- Glitch
- Scanlines
- Grain
- Duotone
Export options
React source
A standalone React component with your shader, colors, and motion settings, ready to paste into a Next.js or Vite app.
PNG image
A still frame at the size you choose, for social images, email headers, slides, or a lightweight fallback.
WebM video
A looping video for places that can't run WebGL, such as social posts, presentations, and some site builders.
Frequently asked questions
- Is the caustics background generator free?
- Yes. beUI Studio is free to use in your browser, including exporting React source, PNG images, and WebM videos.
- How do I add an animated caustics background to a React app?
- Open the background in Studio, adjust it, then export React source. Paste the component into your project and render it behind your content, for example as the first child of a hero section.
- Will an animated WebGL background slow down my site?
- It uses the GPU, so keep it to one background per view, avoid full-resolution canvases on low-power devices, and use the PNG export as a fallback for visitors who prefer reduced motion.
- Can I change the colors to match my brand?
- Yes. Every background takes your own palette, and you can tune speed, scale, detail, distortion, glow, grain, and color adjustments before exporting.