This demonstrates a custom blur shader in p5.strands. The blur is accomplished by adding a random offset to the coordinate at which the texture is sampled. By using only one sample, the blur ends up noisy. Try averaging a few samples to get a smoother blur!
Variable Blur (p5.strands): Created by Dave Pagurek. From 2026 onwards, edited and maintained by p5.js Contributors and Processing Foundation. Licensed under CC BY-NC-SA 4.0.
You can find the code history of these examples here: Code. You can suggest improvements by contributing to the current website!
संबंधित उदाहरण
No alt text
फ़िल्टर शेडर (p5.strands)
शेडर के साथ इमेजरी में हेरफेर करें।
No alt text
फ़िल्टर शेडर (GLSL)
शेडर के साथ इमेजरी में हेरफेर करें।
No alt text
शेडर के साथ स्थितियों को समायोजित करना (p5.strands)
आकार के शीर्षों को समायोजित करने के लिए शेडर का उपयोग करें।
No alt text
शेडर के साथ स्थितियों को समायोजित करना (GLSL)
आकार के शीर्षों को समायोजित करने के लिए शेडर का उपयोग करें।
No alt text
फ़्रेमबफ़र धुंधला
कैमरे के क्षेत्र की गहराई का अनुकरण करें।
A gradient from red to blue.
Gradient (p5.strands)
Draw a radial gradient between two points in p5.strands.
A dithered gradient from red to blue.
Dithered Gradient (p5.strands)
Draw a dithered radial gradient between two points in p5.strands.
A row of five orange spheres. The closest and farthest spheres from the camera appear blurred.
Depth Blur (p5.strands)
Simulate a camera's depth of field, with a shader written in p5.strands.
A city scene blurred around the edges of the frame
Variable Blur (p5.strands)
Create a blur shader with a different amount of blur at different parts of the canvas.