learn GLSL from zero
ToolsCreate with shadersShader MakerFree online shader builderToolkitShader works ready for your siteSketcher LabPaint your landing’s hero with shaders3D StudioThe Three.js editor in your browser
GamesPlay with shadersOnomatoShaderType a word, blow it upThe WatcherAn eye that follows youAetherLiquid glass with an eye insideBloomcoreA word grows a garden of lightPyrokineThrow fire at the wallVoltaicThe pyramid throws lightningSurfSurf a shader ocean

Lesson 6 of 10 · Fractals in GLSL

Julia

Fix c, free z. Filaments everywhere.

Mandelbrot starts z = 0 and lets c be the frag. The Julia set does the opposite: c is a fixed constant and z starts at the frag. Same equation, swapped roles, a different creature.

Each c grows a different Julia. (-0.8, 0.16) gives thin, connected filaments. Change one decimal and the whole galaxy mutates.

vec2 c = vec2(-0.8, 0.16)The Julia constant. The real part -0.8 and imaginary 0.16 define the entire shape. It is the DNA: same iteration for the whole screen, one seed decides whether you get spirals, dust, or branches.
TryChange vec2 c=vec2(-0.8, 0.16) to vec2(0.285, 0.01) for classic spirals, or vec2(-0.4, 0.6) for a dragon. Move zoom to lean into the filaments.

The code

precision highp float;
void main(){
  vec2 uv=(gl_FragCoord.xy*2.0 - R)/R.y;
  float zoom=1.5;
  vec2 z=uv*zoom;
  vec2 c=vec2(-0.8, 0.16);
  float n=0.0; bool esc=false;
  const int IT=150;
  for(int i=0;i<IT;i++){
    z=vec2(z.x*z.x-z.y*z.y, 2.0*z.x*z.y)+c;
    if(dot(z,z)>256.0){ n=float(i); esc=true; break; }
  }
  float sn=esc ? (n - log2(log2(dot(z,z))) + 4.0) : 0.0;
  float band=sn * 0.5;
  vec3 col=0.5+0.5*cos(0.35*band + vec3(0.4,1.6,3.4));
  col=esc ? col : vec3(0.03,0.0,0.05);
  gl_FragColor=vec4(col,1.0);
}
close