Hard EffectsAnimated
Pulsing twisted noise blobs with scanlines
A picture built in steps: zoom in and out, then twist, then draw noise blobs, then color it, then finish with scanlines. Every step is listed below with its exact numbers.
How this challenge works
You write a fragment shader that draws the picture above, live in your browser. A match bar shows how close you are, and the score combines accuracy, code size (the par is 947 characters in Unity (Built-in)) and GPU speed. Work in HLSL, GLSL, WGSL, Metal or Godot and export the result when you are done.
The numbers you need
- Space
p = (uv - 0.5) * float2(aspect, 1.0)- Step 1: Zoom in and out
p *= 1.0 + 0.25 * sin(time * 2.0)- Step 2: Twist
angle = 3.0 * (1.0 - smoothstep(0.0, 0.6, length(p))); turn p by that angle- Step 3: Pattern
m = smoothstep(0.5, 0.54, vnoise(p * 4.5 + float2(2.0, 6.0)))- Step 4: Colors
lerp(float3(0.93, 0.96, 0.91), lerp(float3(0.35, 0.86, 0.13), float3(0.87, 0.15, 0.77), uv.y), m)- Step 5: Finish
col *= 0.8 + 0.2 * step(0.5, frac(uv.y * 120.0))
Helper functions provided
The toolbox has: hash(), vnoise(). Add them above your frag function with one click.
Solve it in your language
Unity (Built-in), Unity (URP), Unreal, Shadertoy / WebGL, OpenGL (LWJGL, raylib), three.js, GameMaker, LÖVE (Lua), Godot, Apple (iOS, macOS), WebGPU / Bevy.
Start coding