# Shayders

> Shayders is an online GLSL shader editor to write WebGL fragment shaders with a live preview, multipass buffers and image, video or webcam channels, then share them with the community.

Shaders are GLSL ES 1.00 fragment shaders running on WebGL 1. Each shader has an Image pass, an optional Common block prepended to every pass, and up to 4 offscreen buffers sampled as `uBufferA`, `uBufferB`... Four texture channels (`uChannel0` to `uChannel3`) accept images, videos, the webcam or another buffer.

## Pages

- [Shader gallery](https://shayders.ayfri.com/): public shaders from the community, sorted by date or name
- [New shader](https://shayders.ayfri.com/new): open the editor with a starter shader, no account needed to experiment
- [Search](https://shayders.ayfri.com/search): find shaders and creators by name
- [Source code](https://github.com/Ayfri/shayders): the GPL-3.0 SvelteKit project behind Shayders

## Built-in uniforms

- `uniform float uTime`: Seconds since the shader started, reset by Run.
- `uniform vec2 uResolution`: Canvas size in pixels (width, height).
- `uniform vec3 uMouse`: Mouse position in pixels from the bottom-left corner, like `gl_FragCoord`. `z` is 1.0 while a button is held.
- `uniform vec4 uDate`: Today's date: year, month (1-12), day (1-31), seconds since midnight.
- `uniform float uFrameRate`: Frames per second, averaged over the last frames.
- `uniform float uDeltaTime`: Seconds since the previous frame.
- `uniform int uFrameCount`: Frames drawn since the shader started, 1 on the first one. Handy to set up a buffer on the first frame.
- `uniform float uAspect`: Width divided by height of the canvas.
- `uniform sampler2D uChannel0`: Texture of channel 0: an image, a video, the webcam or a buffer.
- `uniform sampler2D uChannel1`: Texture of channel 1: an image, a video, the webcam or a buffer.
- `uniform sampler2D uChannel2`: Texture of channel 2: an image, a video, the webcam or a buffer.
- `uniform sampler2D uChannel3`: Texture of channel 3: an image, a video, the webcam or a buffer.
- `uniform sampler2D uBufferA`: Image drawn by Buffer A, read it with `texture2D(uBufferA, gl_FragCoord.xy / uResolution)`.
- `uniform sampler2D uBufferB`: Image drawn by Buffer B, read it with `texture2D(uBufferB, gl_FragCoord.xy / uResolution)`.
- `uniform sampler2D uBufferC`: Image drawn by Buffer C, read it with `texture2D(uBufferC, gl_FragCoord.xy / uResolution)`.
- `uniform sampler2D uBufferD`: Image drawn by Buffer D, read it with `texture2D(uBufferD, gl_FragCoord.xy / uResolution)`.

## Latest public shaders

- [Untitled Shader](https://shayders.ayfri.com/shader/8dnheehcj2o1p28): by Hiyoko
- [Random loop](https://shayders.ayfri.com/shader/syoau4tg68ppn7a): by Ayfri
- [Sunset](https://shayders.ayfri.com/shader/rxfuapjslxh2b2x): by Ayfri
- [Simple and beautiful](https://shayders.ayfri.com/shader/usw9x47zd4oored): by Ayfri, Simple use of buffers
- [Smoke](https://shayders.ayfri.com/shader/yodzd67yxdqxdmq): by Ayfri
- [Background](https://shayders.ayfri.com/shader/p3s0yzqw6dh1q0c): by Ayfri
- [Cube](https://shayders.ayfri.com/shader/0jaca33emjkw3g8): by Ayfri
- [Camera](https://shayders.ayfri.com/shader/ylo4c3lbthahkyw): by Ayfri
- [Whoaaaa](https://shayders.ayfri.com/shader/twho83h287w4uos): by Ayfri, Stylish
- [Alien Core by glkt](https://shayders.ayfri.com/shader/k6nbqylrhzx9oh5): by Ayfri, https://www.shadertoy.com/view/4tcXRr
- [Shayders](https://shayders.ayfri.com/shader/cxzon3he8iwwrbs): by Ayfri, The logo!
- [Windows 95](https://shayders.ayfri.com/shader/kmh610qyy4gj2lz): by Ayfri, https://www.shadertoy.com/view/XstXR2
- [Test 2](https://shayders.ayfri.com/shader/7ng7ow5fnp3vi3d): by Ayfri

## Optional

- [Sitemap](https://shayders.ayfri.com/sitemap.xml): every public shader and creator profile