- Sign In
- Sign Up
Hex-Blocky-Pastel Tile
An alternating hex-blocky tile with a sine-based iterated UV distortion that ended up with colors I'd like to eat.
Created by marcogomez on Fri, 30 Oct 2020 00:47:24 GMT.
// ╔═════════════╦════════════════╗ // ║ Marco Gomez ║ https://mgz.me ║ // ╚═════════════╩════════════════╝ precision highp float; uniform sampler2D prgm2Texture; uniform vec2 resolution; uniform float time; void main(void) { vec2 uv = gl_FragCoord.xy / resolution.xy; vec4 prgm2 = texture2D(prgm2Texture, uv); gl_FragColor = vec4(prgm2.xyz, 1.0); }
// ╔═════════════╦════════════════╗ // ║ Marco Gomez ║ https://mgz.me ║ // ╚═════════════╩════════════════╝ precision highp float; uniform vec2 resolution; uniform vec2 mouselerp; uniform float time; uniform float fft; const float PI = acos(-1.0); // π const float TAU = PI * 2.0; // τ = π * 2 const float SQRT3 = sqrt(3.0); // √3 const float sin60 = SQRT3 / 2.0; // (√3)/2 const float tan30 = SQRT3 / 3.0; // (√3)/3 const float ttp = 1.0 / 3.0; // 1 / 3 const float IHPI = 2.0 / PI; // 2 / π const vec3 F = vec3(95.4337, 96.4337, 97.4337); vec2 hex(vec2 uv, float c) { uv *= c; vec3 hexPos = floor( vec3( uv.x / sin60, uv.y + tan30 * uv.x, uv.y - tan30 * uv.x ) ); return vec2( floor((hexPos.x + (1.0 - mod(floor((hexPos.y + hexPos.z) * ttp), 2.0))) * 0.5), floor((hexPos.y + hexPos.z ) * ttp) ) / c; } float osc(float s, float e, float t) { return (e - s) * 0.5 + s + sin(t) * (e - s) * 0.5; } float ssin (float t) { return IHPI * atan(sin(TAU * t * 0.5) / 0.1) * 2.0; } void vignette(inout vec3 c, in vec2 u) { float v = pow(16.0 * (u.x * u.y * (1.0 - u.x) * (1.0 - u.y)), 0.33); float cv = clamp(v, 0.0, 1.0); c *= v * v; } vec2 fade(vec2 t) { return t * t * t * (t * (t * 6.0 - 15.0) + 10.0); } vec4 permute(vec4 x) { return mod(((x * 34.0) + 1.0) * x, 289.0); } float perlin(vec2 uv) { vec4 pi = floor(uv.xyxy) + vec4(0.0, 0.0, 1.0, 1.0); pi = mod(pi, 289.0); vec4 pf = fract(uv.xyxy) - vec4(0.0, 0.0, 1.0, 1.0); vec4 ix = pi.xzxz, iy = pi.yyww, fx = pf.xzxz, fy = pf.yyww; vec4 i = permute(permute(ix) + iy); vec4 gx = 2.0 * fract(i * 0.0243902439) - 1.0; vec4 gy = abs(gx) - 0.5; vec4 tx = floor(gx + 0.5); gx = gx - tx; vec2 g00 = vec2(gx.x, gy.x); vec2 g01 = vec2(gx.z, gy.z); vec2 g10 = vec2(gx.y, gy.y); vec2 g11 = vec2(gx.w, gy.w); vec4 n = 1.79284291400159 - 0.85373472095314 * vec4( dot(g00, g00), dot(g01, g01), dot(g10, g10), dot(g11, g11) ); g00 *= n.x; g01 *= n.y; g10 *= n.z; g11 *= n.w; float n00 = dot(g00, vec2(fx.x, fy.x)); float n01 = dot(g01, vec2(fx.z, fy.z)); float n10 = dot(g10, vec2(fx.y, fy.y)); float n11 = dot(g11, vec2(fx.w, fy.w)); vec2 fxy = fade(pf.xy); vec2 nx = mix(vec2(n00, n01), vec2(n10, n11), fxy.x); float nxy = mix(nx.x, nx.y, fxy.y); return 2.3 * nxy; } vec3 getBackground(vec2 suv, vec2 uv, vec2 mp, float ar) { float t1 = time * 0.02; float t2 = time * 0.07; float nr = 16.0; float df = nr + osc(16.0, 32.0, t1) + 16.0 * clamp(fft, 0.0, 1.0); vec2 uva = hex(uv, df) * 2.5; vec2 uvb = floor(uv * df) / (df / ar); float strangeSin = ssin(t2); uv = mix(uva, uvb, osc(0.0, 1.0, strangeSin)); for (int i = 1; i < 8; i++) { float fi = float(i); vec2 u = uv + t1; u.x += 0.5 / fi * sin(fi * uv.y + t2 + 0.3 * fi) + 0.5 - mp.x * 0.25; u.y += (0.5 * ar) / fi * sin(fi * uv.x + t2 + 0.3 * fi) - mp.y * 0.25; uv = u; } vec3 col = vec3( sin(3.0 * uv.x) + osc(0.2, 0.4, t2), sin(3.0 * uv.y) + osc(0.1, 0.4, t1), sin(uv.x + uv.y) ); float scanSize = 4.0; float scan = mod(gl_FragCoord.x, scanSize) * mod(gl_FragCoord.y, scanSize); float vig = (0.0 + 1.0 * 12.0 * suv.x * suv.y * (1.0 - suv.x) * (1.0 - suv.y)); float v = exp( -0.01 * length(suv)) * vig; float gs = smoothstep(-1.5, 1.5, dot(col, vec3(0.299, 0.587, 0.114))); vec3 gray = vec3(gs * gs + 0.1); return clamp(mix(col, gray, 0.9) * scan * v, 0.0, 1.0); } void main(void) { vec2 suv = gl_FragCoord.xy / resolution.xy; vec2 uv = (suv - 0.5) * 2.0; float ar = resolution.x / resolution.y; vec2 mp = vec2(mouselerp.x, mouselerp.y); uv.x *= ar; mp.x *= ar; vec3 col = getBackground(suv, uv, mp, ar); gl_FragColor = vec4(col, 1.0); }
// ╔═════════════╦════════════════╗ // ║ Marco Gomez ║ https://mgz.me ║ // ╚═════════════╩════════════════╝ precision highp float; uniform sampler2D prgm1Texture; uniform vec2 resolution; uniform float time; uniform float fft; const float PI = acos(-1.0); const float TAU = PI * 2.0; const float W = 1.2; const float T = 7.5; const float amount = 1.0; const float saturation = 1.2; const float vignetteMix = 0.5; const float vignetteSmoothness = 0.5; const float reinhardAmount = 1.2; const float contrast = 1.9; const float brightness = 1.2; float filmicReinhardCurve(float x) { float q = (T * T + 1.0) * x * x; return q / (q + x + T * T); } vec3 filmicReinhard(vec3 c) { float w = filmicReinhardCurve(W); return vec3( filmicReinhardCurve(c.r), filmicReinhardCurve(c.g), filmicReinhardCurve(c.b) ) / w; } vec3 ContrastSaturationBrightness(vec3 color, float brt, float sat, float con) { const float AvgLumR = 0.5; const float AvgLumG = 0.5; const float AvgLumB = 0.5; const vec3 LumCoeff = vec3(0.2125, 0.7154, 0.0721); vec3 AvgLumin = vec3(AvgLumR, AvgLumG, AvgLumB); vec3 brtColor = color * brt; vec3 intensity = vec3(dot(brtColor, LumCoeff)); vec3 satColor = mix(intensity, brtColor, sat); vec3 conColor = mix(AvgLumin, satColor, con); return conColor; } float sdSquare(vec2 point, float width) { vec2 d = abs(point) - width; return min(max(d.x, d.y), 0.0) + length(max(d, 0.0)); } float vignette(vec2 uv, vec2 size, float roundness, float smoothness) { uv -= 0.5; float minWidth = min(size.x, size.y); uv.x = sign(uv.x) * clamp(abs(uv.x) - abs(minWidth - size.x), 0.0, 1.0); uv.y = sign(uv.y) * clamp(abs(uv.y) - abs(minWidth - size.y), 0.0, 1.0); float boxSize = minWidth * (1.0 - roundness); float dist = sdSquare(uv, boxSize) - (minWidth * roundness); return 1.0 - smoothstep(0.0, smoothness, dist); } float gaussian(float z, float u, float o) { return ( (1.0 / (o * sqrt(TAU))) * (exp(-(((z - u) * (z - u)) / (2.0 * (o * o))))) ); } vec3 gaussgrain(float t) { vec2 ps = vec2(1.0) / resolution.xy; vec2 uv = gl_FragCoord.xy * ps; float seed = dot(uv, vec2(12.9898, 78.233)); float noise = fract(sin(seed) * 43758.5453123 + t); noise = gaussian(noise, 0.0, 0.5); return vec3(noise); } void main(void) { vec2 vignetteSize = vec2(0.25, 0.25) * 1.0 - fft * 0.1; float vignetteRoundness = 0.12 + fft * 0.5; vec2 uv = gl_FragCoord.xy / resolution.xy; vec4 prgm1 = texture2D(prgm1Texture, uv); vec3 reinhard = filmicReinhard(prgm1.rgb); vec3 color = prgm1.rgb; color = mix(prgm1.rgb, reinhard, reinhardAmount); color = ContrastSaturationBrightness(color, brightness, saturation, contrast); float v = vignette(uv, vignetteSize, vignetteRoundness, vignetteSmoothness); vec3 vig = color / v; vec3 g = gaussgrain(time) * 0.06; color = mix(color, vig, vignetteMix); color = mix(prgm1.rgb, color, amount) - g; color = clamp(color, 0.0, 1.0); gl_FragColor = vec4(color, 1.0); }
xxxxxxxxxx
// ╔═════════════╦════════════════╗
// ║ Marco Gomez ║ https://mgz.me ║
// ╚═════════════╩════════════════╝
precision highp float;
uniform sampler2D prgm2Texture;
uniform vec2 resolution;
uniform float time;
void main(void) {
vec2 uv = gl_FragCoord.xy / resolution.xy;
vec4 prgm2 = texture2D(prgm2Texture, uv);
gl_FragColor = vec4(prgm2.xyz, 1.0);
}
79 fps 16ms
00:00:00.54
0.00