A WebGL pulsing glow effect with halftone rendering.
Unlock component
One license unlocks every pro feature for life, including the ones we haven't built yet.
Already have an account? Sign in
| Name | Type | Default | Description |
|---|---|---|---|
| speed | number | 16 | Pulse speed. |
| blurAmount | number | 0.2 | Amount of blur. |
| edgeSize | number | 10 | Thickness of the edge glow. |
| edgeDistortion | number | 0.02 | How much noise warps the edge glow. |
| ringDistortion | number | 0.1 | How much noise warps the ring pulse. |
| edgeColor | string | "#1d334e" | Color of the edge glow. |
| ringColor | string | "#4599ff" | Color of the ring pulse. |
| backgroundColor | string | "#000000" | Solid backdrop the glow is composited over. |
| onTextureReady | (texture) => void | undefined | Returns the rendered effect as a texture. |
React Three Fiber
React renderer for Three.js.
Motion
React animation library.
WebGL Provider (Atelier)
A single shared WebGL canvas for the whole app.