GLSL shader example

Radial Anime Speed Lines

Narrow angular bands appear only near the perimeter. Discrete time controls flicker while a center mask leaves room for a subject.

Live example

Edit the code and the preview updates as you type.

What to observe

Radial Anime Speed Lines.

Mechanism

Narrow angular bands appear only near the perimeter. Discrete time controls flicker while a center mask leaves room for a subject.

The controlling code

float a=atan(p.y,p.x),r=length(p);float id=floor(a*90.);float line=pow(.5+.5*sin(a*90.),14.);float flicker=.4+.6*hash(vec2(id,floor(u_time*8.)));c=mix(vec3(.9,.94,1.),vec3(.1,.15,.3),line*flicker*smoothstep(.25,.9,r)*(0.4+u_parameter));

Experiment

Change the radial center mask smoothstep(.25,.9,r) to smoothstep(.5,.9,r). The empty central area grows while angular lines remain concentrated near the frame perimeter.

Debugging and cost

Line direction and width come from pow(.5+.5*sin(a*90.),14.), while hash supplies discrete flicker. Lower exponent 14. to 6. to broaden each line without changing the number of angular sectors or adding particle geometry.

Built-in functions used

Learn it step by step