Fragment shader
#ifdef GL_ES
precision mediump float;
#endif
uniform float u_time;
uniform vec2 u_resolution;
float HexDist(vec2 p) {
p = abs(p);
float c=dot(p, normalize(vec2(1.,1.73)));
c=max(c, p.x);
return c;
}
#define sat(x)clamp(x,0.,1.)
void main(){
vec2 uv=(gl_FragCoord.xy - .5 / u_resolution.xy)/ u_resolution.y;
uv -= .5;
vec3 col=vec3(0.);
col += sin( HexDist(uv) * 10. + u_time);
col.r += abs(cos(u_time));
col.g *= sat(col.g);
col.b *= mix(col.b, col.g, length(uv));
gl_FragColor=vec4(col, 1.);
}
This fragment shader creates an animation like below.
Fragment Shader is GLSL
, but Unity
uses HLSL
, so cannot use the code directly. Converting needs some modifications.
How to convert
vec<n> --> float<n>
vec2 --> float2
vec3 --> float3
texture --> tex2D
u_time --> _Time.y
atan(x,y) --> atan2(y,x)
fract --> frac
mix --> lerp
mod --> need to write a function
col *= 1.5 --> col = mul(1.5, col)
gl_FragColor --> return
Unity code
Shader "Unlit/fragment"
{
Properties
{
_MainTex ("Texture", 2D) = "white" {}
}
SubShader
{
Tags { "RenderType"="Opaque" }
LOD 100
Pass
{
CGPROGRAM
#pragma vertex vert
#pragma fragment frag
// make fog work
#pragma multi_compile_fog
#include "UnityCG.cginc"
struct appdata
{
float4 vertex : POSITION;
float2 uv : TEXCOORD0;
};
struct v2f
{
float2 uv : TEXCOORD0;
UNITY_FOG_COORDS(1)
float4 vertex : SV_POSITION;
};
sampler2D _MainTex;
float4 _MainTex_ST;
v2f vert (appdata v)
{
v2f o;
o.vertex = UnityObjectToClipPos(v.vertex);
o.uv = TRANSFORM_TEX(v.uv, _MainTex);
UNITY_TRANSFER_FOG(o,o.vertex);
return o;
}
#define mod(x,y) (x-y*floor(x/y))
#define sat(x)clamp(x, 0.0, 1.0)
static const float PI = 3.14159265359;
static const float HALF_PI = 1.57079632675;
static const float TWO_PI = 6.283185307;
static const float3 A = (0.5, 0.5, 0.5);
static const float3 B = (0.5, 0.5, 0.5);
static const float3 C = (0.0, 0.1, 0.2);
static const float2 s = (1.0, 1.73);
float3 palette(float t, float3 a, float3 b, float3 c, float3 d)
{
return A + B * cos(TWO_PI * ( C * t + d));
}
float3 colorize(float d, float t)
{
return palette(d + t, 0.5,
float3(0.5, 0.5, 0.5),
float3(0.5, 0.5, 0.5),
float3(0.0, 0.1, 0.2));
}
float HexDist(float2 p){
p = abs(p);
float c = dot(p, normalize(s) );
c = max(c, p.x);
return c;
}
float4 HexCoord(float2 uv) {
float2 r = s;
float2 h= r * .5;
float2 a = mod(uv, r) - h;
float2 b = mod(uv-h,r) - h;
float2 gv = 0.0;
if(length(a) < length(b)){
gv=a;
}else{
gv=b;
}
float x = atan2(gv.y, gv.x);
float y = float2(0.5, 0.5) - HexDist(gv);
float2 id = uv - gv;
return float4(x, y, id.x ,id.y );
}
fixed4 frag (v2f i) : SV_Target {
float2 uv = i.uv;
uv -= .5;
float3 col=0;
col += sin( HexDist(uv) * 10. + _Time.y);
col.g = mul(sat(col.g), col.g);
return float4(col, 1.);
}
ENDCG
}
}
}
Then the result is like the below. In this case, I put 3 boxes and apply the shader to them.