着色器学习 如何在shadertoy编写着色器 然后应用到threejs去

float Circle(vec2 uv, vec2 p, float r, float blur){

    float d = length(uv-p);
    
    float c = smoothstep(r, r-blur, d);
    
    return c;

}

void mainImage( out vec4 fragColor, in vec2 fragCoord )
{
    vec2 uv = fragCoord/iResolution.xy;
    
    uv -= .5;
    uv.x *= iResolution.x/iResolution.y;
    
    vec3 col = vec3(0.0);
    float mask = Circle(uv, vec2(0.), 0.4, 0.01);
    
    mask -= Circle(uv, vec2(-0.13,0.2), .07, 0.01);
    mask -= Circle(uv, vec2(0.13,0.2), .07, 0.01);
    
    float mouth = Circle(uv, vec2(0.0,0.0), 0.3, 0.05);
    mouth -= Circle(uv, vec2(0.0,0.1), 0.3, 0.05);
    
    mask -= mouth;
    //col = vec3(mouth);
    col = vec3(1.0,1.0,.0)*mask;
    fragColor = vec4(col,1.0);
}