CodeLikeMe

Unreal Color Picker Widget For Character Customization - Part 1

Added 2021-04-27 18:31:30 +0000 UTC

Today, we are going to start implementing a color picker widget in unreal engine. This color picker will be able to use for character skin color modification, weapon color modification or any other color selection requirement. Here, we will have a color selection area which has all the variations of the colors similar to the engine color picker window and 2 sliders which can be used to change hue and value levels. First, we will implement a material for the color selection area with a HSV to RGB conversion in the material for. As the H input in HSV, we will use the x coordinate of the texture coordinate values. Basic HSV to RGB conversion formulae is like this,

float s = HSV.y;

float v = HSV.z;

float4 K = float4(1.0, 2.0 / 3.0, 1.0 / 3.0, 3.0);

float3 p = abs(frac(HSV.xxx + K.xyz) * 6.0 - K.www);

return v * lerp(K.xxx, clamp(p - K.xxx, 0.0, 1.0), s);

We will implement this function in the unreal material editor.

password=codelikeme_colors