> For the complete documentation index, see [llms.txt](https://docs.quickclient.cc/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.quickclient.cc/en/ui/shaders.md).

# Shaders

Your own GLSL shaders for the HUD and the world.

When plain rectangles and gradients are not enough, you can write your own GLSL shader: glow, waves, noise and other effects.

This is handled by `shaders()`. You pass it the sources, Quick puts them into the scripts resource pack where the game reads them, and reloads resources itself. The shader is not compiled right away but on the first draw, and it stays loaded until scripts are reloaded.

```java
private static final String VERTEX = """
        #version 150
        in vec3 Position; in vec4 Color; in vec2 UV0;
        uniform mat4 ModelViewMat; uniform mat4 ProjMat;
        out vec4 vColor; out vec2 vUv;
        void main() {
            gl_Position = ProjMat * ModelViewMat * vec4(Position, 1.0);
            vColor = Color; vUv = UV0;
        }
        """;

private static final String FRAGMENT = """
        #version 150
        in vec4 vColor; in vec2 vUv; out vec4 fragColor;
        void main() {
            float d = distance(vUv, vec2(0.5));
            fragColor = vec4(vColor.rgb, vColor.a * smoothstep(0.5, 0.3, d));
        }
        """;

private final Shader glow = shaders().register("glow", VERTEX, FRAGMENT);

@Override
public void onRender2D(Render2D render) {
    if (glow.ready()) render.shader(glow, 8f, 8f, 160f, 40f, 0xFF41C4C8);
}
```

How it works:

* The vertex shader passes the color and the coordinate inside the rectangle on to the next stage.
* The fragment shader draws a spot: the farther from the center, the more transparent.
* The shader is registered right in the field, and it is only drawn once `ready()` returns `true`.

## Shaders

| Method                                         | Type       | Description                                                                                                     |
| ---------------------------------------------- | ---------- | --------------------------------------------------------------------------------------------------------------- |
| `register(name, vertexSource, fragmentSource)` | `Shader`   | puts the sources into the pack and returns a handle; if the sources did not change, the files are not rewritten |
| `handle(name)`                                 | `Shader`   | handle to a shader whose files are already in the pack                                                          |
| `names()`                                      | `String[]` | list of registered shaders                                                                                      |

A name can contain letters, digits and underscores. `Shader` has `name()`, `ready()` and `error()`. While `ready()` returns `false`, it is too early to draw, and `error()` shows the reason if something went wrong.

## Vertex shader inputs

| Attribute   | Contents                                                                             |
| ----------- | ------------------------------------------------------------------------------------ |
| `Position`  | position                                                                             |
| `Color`     | vertex color                                                                         |
| `UV0`       | for `shader(...)` the coordinate inside the rectangle from 0 to 1, for a mesh its UV |
| `UV1`       | `ivec2`: rectangle size in pixels, multiplied by 8                                   |
| `UV2`       | `ivec2`: two parameters from `shader(..., first, second)`                            |
| `LineWidth` | `float`: time in seconds, unless you pass your own value                             |

The uniforms are the standard ones: `ModelViewMat` and `ProjMat`. The texture, if there is one, is in `Sampler0`.

## Where to use them

| Where                                            | Call                                                                                                                                   |
| ------------------------------------------------ | -------------------------------------------------------------------------------------------------------------------------------------- |
| rectangle on the HUD                             | `render.shader(shader, x, y, w, h, color[, first, second])`                                                                            |
| rectangle where you set every attribute yourself | `render.drawQuad(shader, [texture, [sampler,]] x, y, w, h, u, v, uWidth, vHeight, uv1x, uv1y, uv2x, uv2y, lineWidth, color…[, blend])` |
| mesh on the HUD                                  | `render.drawMesh(mesh, shader, x, y, scale, tint)` and variants with a texture                                                         |
| mesh or billboard in the world                   | `mesh(mesh, shader, texture, …)`, `billboard(mesh, shader, texture, …)` from [3D render](/en/ui/render-3d.md)                          |

`drawQuad` draws a single rectangle: four corner colors and the blend mode `Render2D.NORMAL`, `ADDITIVE` or `OVERWRITE`.

If a shader fails to compile, the script keeps running. `ready()` stays `false`, and the error text is available in `error()` and in the console.


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter, and the optional `goal` query parameter:

```
GET https://docs.quickclient.cc/en/ui/shaders.md?ask=<question>&goal=<endgoal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal.

The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.