WebGL / GLSL Shaders example
Why Punky
Punky is an evolution of our previous framework, Membrillo — a full upgrade designed to provide a clear roadmap for every use case and support ongoing growth. It also brings significant improvements in page speed and overall performance.
If you believe there’s anything missing or unclear, please reach out to Eli, Nerea, or Mara, who are directly involved in shaping the roadmap for this project.
Speed
Built with efficiency at its core — everything loads and runs faster, no matter the scale.
Performance
Engineered for seamless performance — optimized to deliver a smooth, lightning-fast experience.
Reference
Comprehensive and practical — includes examples for nearly every scenario to help you move quickly.
Reveal Shader
Perlin noise with radial fade and progress control.
Grid Shader
Random grid pattern with adjustable size and color.
Noise Shader
Pixel noise pattern with adjustable scale.
Gradient Shader
Vertical gradient between two colors.
Circle Shader
Simple circle with adjustable radius.
Wiggle Shader
Wavy circle with adjustable frequency and amplitude.
Stripes Shader
Vertical stripes with adjustable frequency.