Get an 20% OFF using the RELEASE code on your book purchase. For a limited time.

Introduction to the shader programming language

4.0.2. Our first shader in Cg or HLSL

This post is also available in…

We will continue working with our “USB_simple_color” shader that we created at the beginning of this chapter. 

As we already know, our default shader has a texture called _MainTex which is configured in the properties. What we will do next is add color to change the tint of the texture. 

Before we begin, we must remember that we cannot directly apply a shader to an object in our scene. For this, we need to create a material and assign the shader to it so that it can be rendered graphically. To create a material we must go to our project, right-click on the folder in which we are working, go to Create and select Material. The default configuration of the material depends on the rendering pipeline we have just created. Generally, when we create a material in Built-in RP it comes with a Standard Surface shader type which allows us to visualize the direction of lighting, shadows and other calculations associated with it. 

So, we go to the hierarchy and create a 3D object. We assign the shader USB_simple_color to the material we have recently created and then apply the material to the object in our scene. At this point, we can assign a texture to our material to be projected onto the object.

Go back to our USB_simple_color shader and create a “color” property as we will see in the following example:

Shader “USB / USB_simple_color”
{
    Properties
    {
        _MainTex (“Texture”, 2D) = “white” {}
        _Color (“Texture Color”, Color) = (1, 1, 1, 1)
    }
    SubShader {} ...
}

What we just did was declare a color property for our shader. If we save and return to Unity we can see that this property appears in the Material Inspector, however, it is not working yet because we have not declared it within our CGPROGRAM. What we need to do next is add the _Color connection variable so that we can use it within the program. For this we go to the vertex shader stage; where _MainTex has been declared as sampler2D and create the connection variable in the following way:

uniform sampler2D _Maintex;
uniform float4 _MainTex_ST;
uniform float4 _Color;        // connection variable. 

As we can see, we have declared a global variable for _Color inside our CGPROGRAM or HLSLPROGRAM, however, we are still not using it yet. To change the tint of our texture we will go to the fragment shader stage and multiply col (texture color) by _Color using the multiplication sign. The operation should look like this: 

CGPROGRAM
fixed4 frag (v2f i) : SV_Target
{
    fixed4 col = tex2D(_MainTex, i.uv);
    return col * _Color;
}

HLSLPROGRAM
half4 frag (v2f i) : SV_Target
{
    half4 col = tex2D(_MainTex, i.uv);
    return col * _Color;
}

If we save our shader and go back to Unity, we can now change the tint texture from the material inspector.

Follow us to stay informed about all the latest news, updates, and more.

Join the group to share your experiences with other developers.

Subscribe to our channel and keep learning game dev!

jettelly-logo

Jettelly Team

We are a team of indie developers with more than 9 years of experience in video games. As an independent studio, we have developed Nom Noms in which we published with Hyperbeard in 2019. We are currently developing The Unity Shader Bible.

Follow us on our social networks.