Color Mathematics

From Shader Forge Wiki
Jump to: navigation, search

Shaders use a lot of mathematics, but in many cases, it's doing it with colors.

As you may be familiar with, a color is defined by three channels, R, G and B. Red, Green and Blue, respectively. In Shader Forge, you can create a color in many ways. The Color property is useful for a color you want to tweak in the material, and the Vector3 node is useful for a color you want to keep the same across all materials using your shader.

Arithmetic of Colors

Orange * 0.5

In shaders, each color channel is represented by a value that is (usually) between 0 and 1.

0 means the channel is not contributing at all to the color, whereas 1 means that the color is contributing fully.

So for instance, an orange color would be ( 1, 0.5, 0 ). The Red channel is full, the Green channel adds a little color too, but the blue channel doesn't add anything.

When values in shaders are not in a channel, you can consider single values as grayscale colors, where 0 is black, and 1 is white. Let's say we wanted to make our orange color darker. One way of doing that is to multiply the color, by a value lower than 1, such as 0.5.

Orange * 2

Conversely, you can also make it brighter, by multiplying it by a value above 1, such as 2.

You'll notice that it now looks pure yellow, and this is because your monitors can't handle values beyond 1. However, shaders can, which is an important thing to remember! To the shader, this is now "very orange" instead of just orange. In the same sense, shaders can also handle negative colors, but in those cases, it's usually more used as a directional vector rather than a color, but we'll get into that later.


It's just numbers

Sf uv.png
It's important to remember that the difference between a vector of numbers and a color is not a distinction a shader makes. The preview image on most nodes is just the data rendered as colors; this is why the UV node looks like a gradient from green to orange, because the UV coordinates of a quad, when mapped to the Red and Green color channels, produce the gradient seen below. This visualization is extremely useful when the values you are working with are between 0 and 1.