CanvasItem shaders

CanvasItem shaders are used to draw all 2D elements in Godot. These include all nodes that inherit from CanvasItems, and all GUI elements. CanvasItem shaders contain less built-in variables and functionality than Spatial shaders, but they maintain the same basic structure with vertex, fragment, and light processor functions.

Render modes

Built-ins

Values marked as “in” are read-only. Values marked as “out” are for optional writing and will not necessarily contain sensible values. Values marked as “inout” provide a sensible default value, and can optionally be written to. Samplers are not subjects of writing and they are not marked.

Global built-ins

Global built-ins are available everywhere, including custom functions.

Vertex built-ins

VERTEX) is presented in local space (pixel coordinates, relative to the camera). If not written to, these values will not be modified and be passed through as they came. The user can disable the built-in modelview transform (projection will still happen later) and do it manually with the following code:

  1. shader_type canvas_item;render_mode skip_vertex_transform;void vertex() { VERTEX = (EXTRA_MATRIX * (WORLD_MATRIX * vec4(VERTEX, 0.0, 1.0))).xy;}

Note WORLD_MATRIX is actually a modelview matrix. It takes input in local space and transforms it into view space. In order to get the world space coordinates of a vertex, you have to pass in a custom uniform like so:

  1. material.set_shader_param("global_transform", get_global_transform())

Then, in your vertex shader:

  1. uniform mat4 global_transform;varying vec2 world_position;void vertex(){ world_position = (global_transform * vec4(VERTEX, 0.0, 1.0)).xy;}

world_position can then be used in either the vertex or fragment functions. Other built-ins, such as UV and COLOR, are also passed through to the fragment function if not modified. For instancing, the INSTANCE_CUSTOM variable contains the instance custom data. When using particles, this information is usually:

  • x: Rotation angle in radians.
  • y: Phase during lifetime (0 to 1).
  • z: Animation frame.

    Fragment built-ins

    Sprites) display a texture by default. However, when a custom fragment function is attached to these nodes, the texture lookup needs to be done manually. Godot does not provide the texture color in the COLOR built-in variable; to read the texture color for such nodes, use:
    1. COLOR = texture(TEXTURE, UV);
    NORMAL variable. If you are using a normal map meant for use in 3D, it will appear inverted. In order to use it in your shader, you must assign it to the NORMALMAP property. Godot will handle converting it for use in 2D and overwriting NORMAL.
    1. NORMALMAP = texture(NORMAL_TEXTURE, UV).rgb;

    Light built-ins

    unshaded if you do not want any light passes to occur for that object. Use render_mode light_only if you only want light passes to occur for that object; this can be useful when you only want the object visible where it is covered by light. AT_LIGHT_PASS variable will be true.