【Unity Shaders】调色板之 Shader 绘制 免费下载

最近闲来无事，用shader做了三种调色板，分享给大家，话不多说，先上图

可通过鼠标选取颜色

微信号：ITComputerGraph

更多精彩内容，关注公众号《IT木子李》

 

 第一种调色板：方形 hsv/hsb 调色板，这两个方法分别是 hsb转rgb 和 hsv转rgb，颜色转换完成直接输出

float3 hsb2rgb(float3 c) {
	float3 rgb = clamp(abs(fmod(c.x*6.0 + float3(0.0, 4.0, 2.0), 6.0) - 3.0) - 1.0, 0.0, 1.0);
	rgb = rgb*rgb*(3.0 - 2.0*rgb);
	return c.z * lerp(float3(1.0, 1.0, 1.0), rgb, c.y);
}

float3 hsv2rgb(float3 c)
{
	float3 rgb = clamp(abs(fmod(c.x*6.0 + float3(0.0, 4.0, 2.0), 6.0) - 3.0) - 1.0, 0.0, 1.0);

	return c.z * lerp(float3(1.0, 1.0, 1.0), rgb, c.y);
}

第二种调色板：圆形极坐标 hsb 调色板

float3 hsb2rgb(float3 c) {
	float3 rgb = clamp(abs(fmod(c.x*6.0 + float3(0.0, 4.0, 2.0), 6.0) - 3.0) - 1.0, 0.0, 1.0);
	rgb = rgb*rgb*(3.0 - 2.0*rgb);
	return c.z * lerp(float3(1.0, 1.0, 1.0), rgb, c.y);
}

 同方形调色板，先用 hsb转rgb 得到结果色，再配合极坐标得到圆形坐标颜色

float3 color = float3(0.0,0.0,0.0);

float2 toCenter = float2(0.5, 0.5) - i.uv;
float angle = atan2(toCenter.y,toCenter.x);
float radius = length(toCenter)*2.0;

color = hsb2rgb(float3((angle / TWO_PI + _Time.y/20) + 0.5,radius,1.0));

 

第三种调色板：纵向颜色渐变，把坐标分成6等分，通过颜色渐变得到输出颜色

		i.uv.y	*=	6;
float	y		=	i.uv.y;


float4	color;
float	value;

value = step(y, 1);
color = value * lerp(float4(1, 0, 0, 1), float4(1, 1, 0, 1), y - 0);

value = step(1, y);
value = value * step(y, 2);
color += value * lerp(float4(1, 1, 0, 1), float4(0, 1, 0, 1), y - 1);

value = step(2, y);
value = value * step(y, 3);
color += value * lerp(float4(0, 1, 0, 1), float4(0, 1, 1, 1), y - 2);

value = step(3, y);
value = value * step(y, 4);
color += value * lerp(float4(0, 1, 1, 1), float4(0, 0, 1, 1), y - 3);

value = step(4, y);
value = value * step(y, 5);
color += value * lerp(float4(0, 0, 1, 1), float4(1, 0, 1, 1), y - 4);

value = step(5, y);
value = value * step(y, 6);
color += value * lerp(float4(1, 0, 1, 1), float4(1, 0, 0, 1), y - 5);

更多内容请关注公众号《IT木子李》