每日 shaderToday's Sky
每天早上八点,手机上的 bot 会问我今天心情怎么样。我回一个词、几句话,或者干脆不回。一收到回复(没回的话就等到中午),它就查好埼玉当天的天气,把两样一起交给 Claude,由 Claude 写一段 WebGL fragment shader——一小段自己会画出动态画面的程序。
上线之前,代码要先过几条规则的检查(WebGL 1、循环有上限、除了时间和画布尺寸不读任何输入),不通过就退回去修。你看到的就是它最后交出来的样子。我回给 bot 的原话不会公开,标题只借用其中的意象。
这一幅没能在你的浏览器里编译。
源码halftone dots, rotated grid overprint
precision mediump float;
uniform vec2 u_resolution;
uniform float u_time;
float lum(vec2 p, float ph){
float t = u_time*0.06;
float band = sin(p.y*2.4 - p.x*0.8 + t + ph)*0.5 + 0.5;
vec2 b = p - vec2(-0.12 + 0.05*sin(t*0.7), 0.06);
float blob = exp(-dot(b,b)*3.2);
return clamp(0.58 + 0.18*band + 0.22*blob, 0.0, 1.0);
}
float halftone(vec2 p, float ang, float f, float aa, float ph){
float c = cos(ang);
float s = sin(ang);
vec2 q = mat2(c,-s,s,c)*p;
vec2 qc = (floor(q*f) + 0.5)/f;
vec2 pc = mat2(c,s,-s,c)*qc;
float r = sqrt(clamp(1.0 - lum(pc, ph), 0.0, 1.0))*0.6/f;
float d = length(q - qc);
float cov = 1.0 - smoothstep(r - aa, r + aa, d);
return cov*smoothstep(0.0, aa*2.0, r);
}
void main(){
vec2 uv = (gl_FragCoord.xy - 0.5*u_resolution)/u_resolution.y;
float aa = 1.2/u_resolution.y;
vec3 paper = vec3(0.94,0.90,0.82);
float a = halftone(uv, 0.262, 18.0, aa, 0.0);
float b = halftone(uv, 0.785, 18.0, aa, 1.3);
float c = halftone(uv, 1.309, 18.0, aa, 2.6);
vec3 col = paper;
col *= mix(vec3(1.0), vec3(0.42,0.50,0.56), a*0.9);
col *= mix(vec3(1.0), vec3(0.80,0.64,0.38), b*0.85);
col *= mix(vec3(1.0), vec3(0.72,0.54,0.50), c*0.75);
gl_FragColor = vec4(col,1.0);
}
这一幅没能在你的浏览器里编译。
源码ordered Bayer dithering
precision mediump float;
uniform vec2 u_resolution;
uniform float u_time;
float bayer2(vec2 a) {
a = floor(a);
return mod(a.x * 0.5 + a.y * a.y * 0.75, 1.0);
}
float bayer4(vec2 a) {
return bayer2(a * 0.5) * 0.25 + bayer2(a);
}
vec3 pal(float i) {
vec3 c = vec3(0.15, 0.18, 0.19);
c = mix(c, vec3(0.40, 0.45, 0.44), step(0.5, i));
c = mix(c, vec3(0.68, 0.67, 0.60), step(1.5, i));
c = mix(c, vec3(0.90, 0.86, 0.76), step(2.5, i));
return c;
}
void main() {
vec2 uv = (gl_FragCoord.xy - 0.5 * u_resolution) / u_resolution.y;
float t = u_time;
float drift = sin(uv.x * 2.1 + t * 0.06 + sin(uv.y * 3.0 - t * 0.04) * 0.8);
float bandY = uv.y - 0.10 - 0.08 * sin(t * 0.05 + uv.x * 1.3);
float band = exp(-bandY * bandY / 0.05);
float haze = 0.5 + 0.5 * sin(uv.x * 5.0 - uv.y * 2.0 + t * 0.035);
float v = clamp(0.42 + 0.14 * drift + 0.20 * band + 0.06 * haze - 0.10 * uv.y, 0.0, 1.0);
float cell = floor(max(2.0, u_resolution.y / 120.0));
vec2 p = floor(gl_FragCoord.xy / cell);
float th = bayer4(p) + 0.03125;
float s = v * 3.0;
float base = floor(s);
float idx = clamp(base + step(th, s - base), 0.0, 3.0);
gl_FragColor = vec4(pal(idx), 1.0);
}
这一幅没能在你的浏览器里编译。
源码linocut bands
precision mediump float;
uniform vec2 u_resolution;
uniform float u_time;
const vec3 PAPER=vec3(0.929,0.894,0.812);
const vec3 INK=vec3(0.141,0.169,0.184);
const vec3 RUST=vec3(0.560,0.247,0.165);
float hash(vec2 p){return fract(sin(dot(p,vec2(127.1,311.7)))*43758.5453);}
float vnoise(vec2 p){vec2 i=floor(p);vec2 f=fract(p);vec2 u=f*f*(3.0-2.0*f);return mix(mix(hash(i),hash(i+vec2(1.0,0.0)),u.x),mix(hash(i+vec2(0.0,1.0)),hash(i+vec2(1.0,1.0)),u.x),u.y);}
float fbm(vec2 p){float s=0.0;float a=0.5;for(int i=0;i<4;i++){s+=a*vnoise(p);p=p*2.03+vec2(1.7,9.2);a*=0.5;}return s;}
void main(){
vec2 uv=(gl_FragCoord.xy-0.5*u_resolution)/u_resolution.y;
float t=u_time;
float w=fbm(uv*1.3+vec2(t*0.010,-t*0.004));
vec2 sp=vec2(uv.x*0.85,uv.y-0.08);
float sun=exp(-3.2*dot(sp,sp));
float j=vnoise(uv*vec2(5.0,3.0)+vec2(t*0.025,0.0))-0.5;
float lum=0.50+0.55*(w-0.5)-0.30*uv.y+0.38*sun+0.12*j;
float lv=clamp(floor(lum*4.0),0.0,3.0);
vec3 c0=INK;vec3 c1=mix(PAPER,INK,0.55);vec3 c2=mix(PAPER,INK,0.2);vec3 c3=PAPER;
vec3 col=mix(mix(c0,c1,step(0.5,lv)),mix(c2,c3,step(2.5,lv)),step(1.5,lv));
float ang=0.55;
float s=dot(uv,vec2(cos(ang),sin(ang)))*22.0+j*1.2;
float f=abs(fract(s)-0.5);
float ln=smoothstep(0.22,0.30,f);
float dark0=1.0-step(0.5,lv);
float dark1=step(0.5,lv)*(1.0-step(1.5,lv));
col=mix(col,PAPER,ln*dark0*0.8);
col=mix(col,INK,ln*dark1*0.7);
col=mix(col,RUST,sun*step(2.5,lv)*0.22);
gl_FragColor=vec4(col,1.0);
}
这一幅没能在你的浏览器里编译。
源码moiré gratings, concentric ring beat
precision mediump float;
uniform vec2 u_resolution;
uniform float u_time;
const float TAU = 6.2831853;
float ring(vec2 p, vec2 c, float per) {
float d = length(p - c);
return 0.5 + 0.5 * cos(TAU * d / per);
}
float bars(vec2 p, float ang, float per) {
float s = p.x * cos(ang) + p.y * sin(ang);
return 0.5 + 0.5 * cos(TAU * s / per);
}
void main() {
vec2 uv = (gl_FragCoord.xy - 0.5 * u_resolution) / u_resolution.y;
float t = u_time;
vec2 c1 = vec2(-0.18 + 0.05 * sin(t * 0.11), 0.03 + 0.04 * cos(t * 0.09));
vec2 c2 = vec2(0.19 + 0.04 * cos(t * 0.08), -0.04 + 0.05 * sin(t * 0.13));
float g1 = ring(uv, c1, 0.058);
float g2 = ring(uv, c2, 0.063);
float g3 = bars(uv, 0.42 + 0.03 * sin(t * 0.07), 0.071);
float beat = g1 * g2;
float ink = mix(beat, beat * g3, 0.45);
float k = smoothstep(0.02, 0.6, ink);
vec3 cream = vec3(0.97, 0.92, 0.79);
vec3 ochre = vec3(0.90, 0.63, 0.25);
vec3 rust = vec3(0.60, 0.27, 0.17);
vec3 teal = vec3(0.14, 0.34, 0.36);
vec3 col = mix(rust, ochre, smoothstep(0.0, 0.35, k));
col = mix(col, cream, smoothstep(0.45, 1.0, k));
col = mix(col, teal, 0.18 * (1.0 - k) * smoothstep(0.9, 0.2, length(uv)));
gl_FragColor = vec4(col, 1.0);
}
这一幅没能在你的浏览器里编译。
源码kaleidoscope symmetry, polar folding
precision mediump float;
uniform vec2 u_resolution;
uniform float u_time;
const float PI = 3.14159265;
const float SEG = PI / 4.0;
const vec3 OCHRE = vec3(0.90, 0.62, 0.16);
const vec3 RUST = vec3(0.70, 0.30, 0.15);
const vec3 TEAL = vec3(0.14, 0.44, 0.42);
const vec3 PLUM = vec3(0.46, 0.22, 0.36);
const vec3 CREAM = vec3(0.96, 0.90, 0.74);
void main() {
vec2 uv = (gl_FragCoord.xy - 0.5 * u_resolution.xy) / u_resolution.y;
float t = u_time;
float r = length(uv);
float a = atan(uv.y, uv.x) + t * 0.05;
a = mod(a, SEG);
a = abs(a - 0.5 * SEG);
vec2 p = r * vec2(cos(a), sin(a));
float aa = 0.008;
vec3 col = mix(vec3(0.88, 0.74, 0.52), vec3(0.74, 0.52, 0.34), smoothstep(0.15, 0.7, r));
float ring = abs(r - (0.33 + 0.02 * sin(t * 0.5))) - 0.03;
col = mix(col, TEAL, 1.0 - smoothstep(-aa, aa, ring));
float d1 = length(p - vec2(0.22 + 0.03 * sin(t * 0.4), 0.09)) - (0.085 + 0.01 * sin(t * 0.7));
col = mix(col, RUST, 1.0 - smoothstep(-aa, aa, d1));
float d2 = length(p - vec2(0.40, 0.0)) - 0.05;
col = mix(col, OCHRE, 1.0 - smoothstep(-aa, aa, d2));
float dots = 1.0;
for (int i = 0; i < 4; i++) {
float fi = float(i);
vec2 c = vec2(0.12 + 0.09 * fi, 0.05 * sin(t * 0.3 + fi * 1.7) - 0.03 * fi);
dots = min(dots, length(p - c) - (0.022 + 0.004 * fi));
}
col = mix(col, PLUM, 1.0 - smoothstep(-aa, aa, dots));
float core = r - (0.07 + 0.01 * sin(t * 0.9));
col = mix(col, CREAM, 1.0 - smoothstep(-aa, aa, core));
gl_FragColor = vec4(clamp(col, 0.0, 1.0), 1.0);
}
这一幅没能在你的浏览器里编译。
源码luminance hatching: three angled pen-line sets whose presence and width follow scene brightness
precision mediump float;
uniform vec2 u_resolution;
uniform float u_time;
float hash(vec2 p){return fract(sin(dot(p,vec2(127.1,311.7)))*43758.5453);}
float noise(vec2 p){vec2 i=floor(p);vec2 f=fract(p);f=f*f*(3.0-2.0*f);
return mix(mix(hash(i),hash(i+vec2(1.0,0.0)),f.x),mix(hash(i+vec2(0.0,1.0)),hash(i+vec2(1.0,1.0)),f.x),f.y);}
float fbm(vec2 p){float s=0.0;float a=0.5;
for(int i=0;i<4;i++){s+=a*noise(p);p=p*2.03+vec2(1.7,9.2);a*=0.5;}
return s;}
float glowAt(vec2 uv){return exp(-length((uv-vec2(0.26,0.22))*vec2(0.8,1.6))*3.5);}
float sky(vec2 uv,float t){
float L=0.64+0.3*uv.y;
L+=0.28*glowAt(uv);
float n=fbm(uv*vec2(1.4,3.4)+vec2(t*0.012,0.0));
L-=0.3*smoothstep(0.45,0.75,n);
return L;}
float scene(vec2 uv,float t,float px){
float L=sky(uv,t);
float x=uv.x;
float h1=-0.06+0.045*sin(x*3.1+1.0)+0.02*sin(x*7.3+0.4);
float far=smoothstep(h1+px*1.5,h1-px*1.5,uv.y);
L=mix(L,0.52,far);
float h2=-0.15+0.05*sin(x*2.2+2.0)+0.018*sin(x*5.7+0.5);
float tx=(x+0.3)/0.06;float ty=(x+0.2)/0.05;
h2+=0.09*exp(-tx*tx)+0.06*exp(-ty*ty)+0.012*noise(vec2(x*24.0,1.0));
float near=smoothstep(h2+px*1.5,h2-px*1.5,uv.y);
L=mix(L,0.27,near);
return L;}
float hatch(vec2 uv,float ang,float L,float thr,float sp,float px){
vec2 dir=vec2(cos(ang),sin(ang));
float c=dot(uv,vec2(-dir.y,dir.x));
c+=0.12*sp*sin(dot(uv,dir)*7.0+ang*5.0);
float d=abs(fract(c/sp)-0.5)*sp;
float k=clamp((thr-L)/(thr*0.8),0.0,1.0);
float hw=mix(px,0.3*sp,k);
float a=smoothstep(0.0,0.06,thr-L);
return a*(1.0-smoothstep(hw-px*0.75,hw+px*0.75,d));}
void main(){
vec2 uv=(gl_FragCoord.xy-0.5*u_resolution)/u_resolution.y;
float px=1.0/u_resolution.y;
float t=u_time;
float sp=max(0.026,7.0*px);
float wl=-0.24;
float L;
if(uv.y<wl){
vec2 m=vec2(uv.x+0.01*sin(uv.y*80.0+t*0.5),2.0*wl-uv.y);
L=scene(m,t,px)*0.85;
float rp=sin(uv.y*70.0+sin(uv.x*3.0+t*0.25)*2.0+t*0.3);
L+=0.06*rp;
L+=0.18*exp(-abs(uv.x-0.26)*7.0)*(0.6+0.4*rp);
L-=0.25*(wl-uv.y);
L=mix(L,0.6,smoothstep(wl-0.008,wl,uv.y));
} else {
L=scene(uv,t,px);
}
float h1=hatch(uv,0.75,L,0.74,sp,px);
float h2=hatch(uv,-0.85,L,0.52,sp*0.92,px);
float h3=hatch(uv,0.08,L,0.36,sp*0.85,px);
float ink=1.0-(1.0-h1)*(1.0-h2)*(1.0-h3);
float g=glowAt(uv);
vec3 paper=mix(vec3(0.82,0.84,0.82),vec3(0.94,0.89,0.79),clamp(g*1.2,0.0,1.0));
paper*=0.9+0.1*clamp(L,0.0,1.0);
paper+=0.025*(noise(uv*38.0)-0.5);
vec3 inkc=vec3(0.17,0.21,0.28);
vec3 col=mix(paper,inkc,ink*0.88);
float v=1.0-0.18*dot(uv*vec2(0.7,1.0),uv*vec2(0.7,1.0));
col*=v;
gl_FragColor=vec4(col,1.0);
}
这一幅没能在你的浏览器里编译。
源码quarter-arc truchet tiles with two-colored regions and slowly rotating cells
precision mediump float;
uniform vec2 u_resolution;
uniform float u_time;
const float S = 8.0;
const float HP = 1.5707963;
float h(vec2 p){return fract(sin(dot(p,vec2(127.1,311.7)))*43758.5453);}
float vn(vec2 p){
vec2 i=floor(p);vec2 f=fract(p);f=f*f*(3.0-2.0*f);
return mix(mix(h(i),h(i+vec2(1.0,0.0)),f.x),mix(h(i+vec2(0.0,1.0)),h(i+vec2(1.0,1.0)),f.x),f.y);
}
float arcs(vec2 f, out float inside){
float a=length(f-0.5);
float b=length(f+0.5);
inside=step(min(a,b),0.5);
return min(abs(a-0.5),abs(b-0.5));
}
void main(){
vec2 uv=(gl_FragCoord.xy-0.5*u_resolution)/u_resolution.y;
float t=u_time;
vec2 p=uv*S+vec2(t*0.05,t*0.012);
vec2 id=floor(p);
vec2 f=fract(p)-0.5;
float P=mod(id.x+id.y,2.0);
float base=step(0.5,h(id));
float fl=step(h(id+17.3),0.28);
float cyc=t*0.03+h(id+5.1)*7.0;
float k=floor(cyc)*fl;
float s=smoothstep(0.78,1.0,fract(cyc))*fl;
float st=mod(base+k,2.0);
float an=s*HP;
float ca=cos(an);float sa=sin(an);
f=mat2(ca,-sa,sa,ca)*f;
if(st>0.5) f.x=-f.x;
float ins;
float d=arcs(f,ins);
float c0=mod(P+st+1.0-ins,2.0);
float c=mix(c0,1.0-c0,s);
float g=clamp(uv.y+0.5,0.0,1.0);
vec3 sky=mix(vec3(0.50,0.53,0.52),vec3(0.70,0.73,0.74),g);
vec3 colA=sky*0.85+vec3(0.0,0.012,0.025);
vec3 colB=sky;
float leaf=smoothstep(0.55,0.82,vn(p*0.18+vec2(3.0,t*0.01)))*(1.0-g*0.6);
colA=mix(colA,vec3(0.66,0.50,0.34),leaf*0.6);
colB=mix(colB,vec3(0.74,0.64,0.50),leaf*0.25);
vec3 col=mix(colA,colB,c);
float cl=vn(uv*1.6+vec2(t*0.015,0.3));
col*=0.9+0.18*cl;
float aa=1.5*S/u_resolution.y;
col*=1.0-0.16*(1.0-smoothstep(0.0,0.3,d));
float w=0.07;
float sh=1.0-smoothstep(w,w+0.12,d);
col*=1.0-0.12*sh;
float line=1.0-smoothstep(w-aa,w+aa,d);
vec3 ink=mix(vec3(0.20,0.24,0.27),vec3(0.31,0.34,0.37),g);
col=mix(col,ink,line*0.85);
vec2 v=uv*vec2(0.6,1.0);
col*=1.0-0.25*dot(v,v);
gl_FragColor=vec4(col,1.0);
}
这一幅没能在你的浏览器里编译。
源码riso print layers: three flat spot-ink SDF layers with misregistration, multiply overprint, knockout halo, ink mottle and paper grain
precision mediump float;
uniform vec2 u_resolution;
uniform float u_time;
const vec2 SUN = vec2(0.2, 0.1);
float h(vec2 p){ return fract(sin(dot(p, vec2(127.1, 311.7))) * 43758.5453); }
float vn(vec2 p){
vec2 i = floor(p); vec2 f = fract(p); f = f * f * (3.0 - 2.0 * f);
return mix(mix(h(i), h(i + vec2(1.0, 0.0)), f.x), mix(h(i + vec2(0.0, 1.0)), h(i + 1.0), f.x), f.y);
}
float fill(float d, float aa){ return 1.0 - smoothstep(-aa, aa, d); }
float leaf(vec2 p, vec2 c, float a, float s){
p -= c;
float cs = cos(a); float sn = sin(a);
p = mat2(cs, -sn, sn, cs) * p;
p /= s;
float d = max(length(p - vec2(0.0, -0.6)) - 1.0, length(p + vec2(0.0, -0.6)) - 1.0);
return d * s;
}
float leaves(vec2 p, float t, float k, float aa){
float m = 0.0;
for (int i = 0; i < 9; i++){
float fi = float(i);
float layer = fi - 3.0 * floor(fi / 3.0 + 0.1);
if (abs(layer - k) < 0.5){
float x = mod(fi * 0.267 + t * 0.035 + 0.15, 2.4) - 1.2;
float y = 0.36 - fract(fi * 0.618) * 0.6 + 0.035 * sin(t * 0.7 + fi * 1.7);
x += 0.02 * sin(t * 0.9 + fi * 2.3);
float a = 0.5 * sin(t * 0.6 + fi * 2.0) + fi;
float s = 0.055 + 0.022 * fract(fi * 0.37);
m = max(m, fill(leaf(p, vec2(x, y), a, s), aa));
}
}
return m;
}
float layerY(vec2 p, float t, float aa){
float m = fill(length(p - SUN) - 0.2, aa);
m = max(m, fill(p.y - (-0.33 + 0.035 * sin(p.x * 4.0 + 1.0)), aa));
m = max(m, leaves(p, t, 2.0, aa));
return m;
}
float layerP(vec2 p, float t, float aa){
float r = 0.29 + 0.01 * sin(t * 0.5);
float m = fill(abs(length(p - SUN) - r) - 0.022, aa);
m = max(m, fill(p.y - (-0.25 + 0.06 * sin(p.x * 2.3 - 0.8)), aa));
m = max(m, leaves(p, t, 0.0, aa));
return m;
}
float layerB(vec2 p, float t, float aa){
float m = 0.18 * (1.0 - fill(length(p - SUN) - 0.235, aa));
m = max(m, fill(p.y - (-0.38 + 0.05 * sin(p.x * 3.1 + 2.0)), aa));
for (int j = 0; j < 4; j++){
float fj = float(j);
float cx = mod(fj * 0.61 + t * 0.06 + 0.3, 2.4) - 1.2;
float cy = 0.4 - fj * 0.11 + 0.012 * sin(t * 0.8 + fj * 2.0);
float d = length(vec2(max(abs(p.x - cx) - 0.16 + fj * 0.02, 0.0), p.y - cy)) - 0.012;
m = max(m, fill(d, aa));
}
m = max(m, leaves(p, t, 1.0, aa));
return m;
}
void main(){
vec2 uv = (gl_FragCoord.xy - 0.5 * u_resolution) / u_resolution.y;
float aa = 1.5 / u_resolution.y;
float t = u_time;
float sway = 1.0 + 0.25 * sin(t * 0.4);
vec2 oP = vec2(0.007, -0.004) * sway;
vec2 oB = vec2(-0.005, 0.004) * sway;
float y = layerY(uv, t, aa);
float pk = layerP(uv + oP, t, aa);
float bl = layerB(uv + oB, t, aa);
vec2 px = gl_FragCoord.xy;
y *= (0.9 + 0.1 * vn(uv * 7.0 + 3.0)) * (0.93 + 0.07 * vn(px * 0.4 + 17.0));
pk *= (0.88 + 0.12 * vn(uv * 6.0 + 11.0)) * (0.93 + 0.07 * vn(px * 0.4 + 41.0));
bl *= (0.88 + 0.12 * vn(uv * 6.5 + 29.0)) * (0.93 + 0.07 * vn(px * 0.4 + 73.0));
vec3 paper = vec3(0.96, 0.93, 0.86);
vec3 Y = vec3(1.0, 0.84, 0.18);
vec3 P = vec3(1.0, 0.36, 0.62);
vec3 B = vec3(0.15, 0.45, 0.78);
vec3 col = paper * mix(vec3(1.0), Y, y) * mix(vec3(1.0), P, pk) * mix(vec3(1.0), B, bl);
col *= 0.965 + 0.05 * vn(px * 0.5);
col = max(col, vec3(0.08, 0.07, 0.06));
gl_FragColor = vec4(col, 1.0);
}
这一幅没能在你的浏览器里编译。
源码analytic sky scattering: Rayleigh + Henyey-Greenstein Mie with airmass extinction, under a projected stratus lid and rippled mirror
precision mediump float;
uniform vec2 u_resolution;
uniform float u_time;
const vec3 BR = vec3(0.0058, 0.0135, 0.0331);
const float BM = 0.021;
const float ZR = 8.0;
const float ZM = 1.2;
const float HZ = -0.2;
float airm(float y){ return 1.0/(max(y,0.0)+0.035); }
vec3 dirOf(float az, float el){ return vec3(sin(az)*cos(el), sin(el), cos(az)*cos(el)); }
vec3 sunExt(vec3 s){ return exp(-(BR*ZR+BM*ZM)*airm(s.y)); }
vec3 atmo(vec3 d, vec3 s){
float ch = length(d-s);
float omu = 0.5*ch*ch;
float mu = 1.0-omu;
vec3 fex = exp(-(BR*ZR+BM*ZM)*airm(d.y));
float pR = 0.75*(1.0+mu*mu);
float g = 0.72;
float pM = (1.0-g*g)/pow((1.0-g)*(1.0-g)+2.0*g*omu, 1.5);
vec3 ph = (BR*pR + BM*pM*0.35)/(BR+BM);
return 9.0*ph*(1.0-fex)*sqrt(sunExt(s)) + vec3(0.04,0.05,0.08);
}
float cloud(vec3 d, float t){
float fade = smoothstep(0.07, 0.22, d.y);
vec2 p = d.xz/(d.y+0.05);
vec2 q = p*0.55 + vec2(t*0.015, t*0.004);
float v = 0.5 + 0.25*sin(q.x*1.3+1.7*sin(q.y*0.9)) + 0.2*sin(q.y*2.6+q.x*0.7+t*0.03) + 0.12*sin((q.x-q.y)*2.1+0.5);
return smoothstep(0.38, 0.78, v)*fade;
}
vec3 sky(vec3 d, vec3 s, float t){
vec3 c = atmo(d, s);
vec3 ext = sunExt(s);
float a = length(d-s);
float mu = 1.0-0.5*a*a;
c += ext*6.0*smoothstep(0.032, 0.024, a);
float cl = cloud(d, t);
float fw = pow(max(mu,0.0), 6.0);
vec3 cc = vec3(0.55,0.56,0.66)*(1.0-0.3*cl) + ext*2.5*fw*(1.0-0.5*cl) + vec3(0.14,0.09,0.05)*(1.0-smoothstep(0.1,0.5,d.y));
c = mix(c, cc, cl*0.9);
float l = dot(c, vec3(0.33));
return mix(c, vec3(l)*vec3(0.96,0.97,1.04), 0.25);
}
vec3 scene(float x, float yv, vec3 s, float t){
float az = x*0.95;
vec3 c = sky(dirOf(az, max(yv,0.0)*1.25), s, t);
vec3 hz = atmo(dirOf(az, 0.03), s);
float far = 0.03 + 0.02*sin(x*2.3+0.3) + 0.008*sin(x*5.3+4.0) + 0.012;
float near = 0.012 + 0.016*sin(x*2.9+0.4) + 0.008*sin(x*7.1+2.0);
c = mix(c, mix(hz, vec3(0.32,0.32,0.42), 0.35), smoothstep(far+0.004, far-0.004, yv));
c = mix(c, mix(hz, vec3(0.12,0.13,0.2), 0.7), smoothstep(near+0.004, near-0.004, yv));
return c;
}
void main(){
vec2 uv = (gl_FragCoord.xy - 0.5*u_resolution)/u_resolution.y;
float t = u_time;
vec3 sun = dirOf(0.12, 0.1 + 0.02*sin(t*0.025-0.3));
float yy = uv.y - HZ;
vec3 col;
if (yy >= 0.0) {
col = scene(uv.x, yy, sun, t);
} else {
float h = -yy;
float w = sin(3.2/(h+0.1) + t*0.5 + uv.x*1.5) + 0.5*sin(5.0/(h+0.13) - t*0.35 - uv.x*2.2);
float amp = 0.012*smoothstep(0.0, 0.05, h)*(0.5 + h*3.0);
col = scene(uv.x + w*amp*0.6, h + w*amp, sun, t);
col *= vec3(0.6,0.64,0.72)*mix(0.9, 0.5, smoothstep(0.0, 0.3, h));
}
col = col/(1.0+col);
float l = dot(col, vec3(0.299,0.587,0.114));
col = mix(vec3(l), col, 0.82);
col = col*0.9 + vec3(0.035,0.04,0.055);
col *= 1.0 - 0.15*dot(uv, uv);
gl_FragColor = vec4(col, 1.0);
}
这一幅没能在你的浏览器里编译。
源码fluted glass: per-flute sine-derivative refraction with RGB dispersion, groove shading, specular ridges and lensing droplets over a rainy dusk scene
precision mediump float;
uniform vec2 u_resolution;
uniform float u_time;
const float PI = 3.14159265;
const float FW = 0.055;
float hash(float n){ return fract(sin(n * 12.9898) * 43758.5453); }
float noise(float x){ float i = floor(x); float f = fract(x); f = f * f * (3.0 - 2.0 * f); return mix(hash(i), hash(i + 1.0), f); }
vec3 scene(vec2 p, float t){
float sky = smoothstep(-0.35, 0.5, p.y);
vec3 col = mix(vec3(0.27, 0.31, 0.34), vec3(0.50, 0.54, 0.56), sky);
col += 0.05 * (noise(p.x * 3.0 + t * 0.05) - 0.5) * sky;
float hz = exp(-pow((p.y + 0.1) * 7.0, 2.0));
col += vec3(0.16, 0.10, 0.05) * hz;
float br = 0.88 + 0.12 * sin(t * 0.4);
vec2 g = p - vec2(0.06 * sin(t * 0.06), -0.06 + 0.025 * sin(t * 0.09));
float d = length(g);
col += vec3(1.0, 0.58, 0.25) * exp(-d * d * 14.0) * 0.75 * br;
col = mix(col, vec3(1.0, 0.84, 0.6), smoothstep(0.085, 0.05, d) * 0.85);
for (int i = 0; i < 8; i++){
float fi = float(i);
float bx = (hash(fi + 1.3) - 0.5) * 1.9 + 0.03 * sin(t * 0.2 + fi);
float by = -0.24 + 0.16 * hash(fi + 7.1);
float r = 0.025 + 0.03 * hash(fi + 3.7);
vec3 bc = mix(vec3(0.95, 0.45, 0.2), vec3(0.35, 0.7, 0.75), step(0.65, hash(fi + 9.2)));
float bd = length(p - vec2(bx, by));
col += bc * smoothstep(r, r * 0.4, bd) * (0.35 + 0.15 * sin(t * 0.3 + fi * 2.0));
}
float ground = -0.27 + 0.05 * noise(p.x * 5.0) + 0.03 * noise(p.x * 13.0 + 4.0);
float gm = smoothstep(ground + 0.015, ground - 0.015, p.y);
vec3 gc = mix(vec3(0.26, 0.15, 0.10), vec3(0.12, 0.16, 0.17), smoothstep(-0.3, -0.5, p.y));
col = mix(col, gc, gm * 0.9);
vec2 q = vec2(p.x + p.y * 0.15, p.y);
float cx = floor(q.x * 26.0);
float lx = fract(q.x * 26.0) - 0.5;
float sy = fract(q.y * 1.5 + t * (0.9 + 0.5 * hash(cx)) + hash(cx + 5.0));
float streak = smoothstep(0.22, 0.0, abs(lx)) * smoothstep(0.0, 0.1, sy) * smoothstep(0.45, 0.1, sy);
col += vec3(0.75, 0.82, 0.86) * streak * 0.10 * step(0.35, hash(cx + 11.0));
return col;
}
void main(){
vec2 uv = (gl_FragCoord.xy - 0.5 * u_resolution) / u_resolution.y;
float t = u_time;
float idx = floor(uv.x / FW);
float f = fract(uv.x / FW) - 0.5;
float dh = -sin(f * PI);
float hs = hash(idx * 3.1 + 0.7);
float yd = 0.65 - fract(t * (0.025 + 0.04 * hs) + hs * 7.0) * 1.4;
float dy = uv.y - yd;
float has = step(0.55, hash(idx + 21.0));
float ox = f * FW;
float drop = has * smoothstep(1.0, 0.75, length(vec2(ox / 0.017, dy / 0.024)));
float trail = has * step(0.0, dy) * smoothstep(0.3, 0.0, dy) * smoothstep(0.32, 0.12, abs(f));
float amp = 0.035 * (1.0 - 0.6 * trail);
vec2 base = vec2(uv.x + dh * amp, uv.y + 0.004 * dh);
vec3 col;
col.r = scene(base - vec2(dh * 0.006, 0.0), t).r;
col.g = scene(base, t).g;
col.b = scene(base + vec2(dh * 0.006, 0.0), t).b;
float cX = (idx + 0.5) * FW;
vec3 dc = scene(vec2(cX - ox * 4.0, yd - dy * 4.0), t) * 1.06;
col = mix(col, dc, drop);
col *= 1.0 - 0.3 * drop * smoothstep(0.0, -0.024, dy);
vec2 sp = vec2(ox + 0.005, dy - 0.009);
col += vec3(1.0, 0.96, 0.9) * exp(-dot(sp, sp) / 0.00005) * 0.35 * has;
col *= 1.0 - 0.22 * pow(abs(f) * 2.0, 3.0);
col += vec3(1.0, 0.95, 0.85) * exp(-pow((f + 0.2) * 5.0, 2.0)) * 0.09;
float warm = exp(-uv.x * uv.x * 6.0) * exp(-pow((uv.y + 0.06) * 3.0, 2.0));
col += vec3(0.9, 0.55, 0.25) * exp(-pow((f - 0.3) * 6.0, 2.0)) * 0.08 * warm;
col += vec3(0.02, 0.03, 0.035) * trail;
vec2 vg = uv * vec2(0.6, 1.0);
col *= 1.0 - 0.35 * dot(vg, vg);
col = clamp(col, 0.03, 0.97);
gl_FragColor = vec4(col, 1.0);
}
这一幅没能在你的浏览器里编译。
源码woven threshold pattern: per-cell warp/weft interlacing decided by twill and diamond threshold matrices against a cloud, medallion and rain field
precision mediump float;
uniform vec2 u_resolution;
uniform float u_time;
float h1(float n){return fract(sin(n*127.1)*43758.5453);}
float h2(vec2 p){return fract(sin(dot(p,vec2(127.1,311.7)))*43758.5453);}
float vn(vec2 p){vec2 i=floor(p);vec2 f=fract(p);f=f*f*(3.0-2.0*f);
return mix(mix(h2(i),h2(i+vec2(1.0,0.0)),f.x),mix(h2(i+vec2(0.0,1.0)),h2(i+vec2(1.0,1.0)),f.x),f.y);}
float prof(float a){return 1.0-smoothstep(0.32,0.47,abs(a));}
void main(){
vec2 uv=(gl_FragCoord.xy-0.5*u_resolution)/u_resolution.y;
float t=u_time;
const float N=26.0;
vec2 g=uv*N;
vec2 id=floor(g);
vec2 f=fract(g)-0.5;
vec2 c=(id+0.5)/N;
float cl=vn(c*3.0+vec2(t*0.05,0.0))*0.6+vn(c*6.0-vec2(t*0.03,t*0.01))*0.4;
vec2 mc=c-vec2(0.0,0.04);
float r=length(mc)+0.03*sin(atan(mc.y,mc.x)*6.0+t*0.4);
float rad=0.27+0.012*sin(t*0.7);
float m=1.0-smoothstep(rad-0.03,rad+0.01,r);
float ring=smoothstep(0.035,0.0,abs(r-rad-0.045));
float colI=floor(g.x+g.y*0.22);
float hc=h1(colI);
float rain=0.0;
if(hc>0.45){
float sp=0.09+0.07*h1(colI+3.1);
float yd=0.62-fract(t*sp+hc*9.0)*1.3;
float d=c.y-yd;
rain=exp(-max(d,0.0)*8.0)*smoothstep(-0.05,0.0,d);
}
float v=0.12+0.22*cl+m*0.28+ring*0.5+rain*0.9;
float tw=(mod(id.x+id.y,4.0)+0.5)/4.0;
vec2 q=abs(mod(id,8.0)-3.5);
float td=(mod(q.x+q.y,4.0)+0.5)/4.0;
float thr=mix(tw,td,step(0.5,m));
float w=step(thr,v);
float ry=mod(id.y,12.0);
vec3 weft=mix(vec3(0.15,0.19,0.36),vec3(0.13,0.34,0.40),step(6.0,ry));
weft=mix(weft,vec3(0.86,0.63,0.22),step(abs(ry-3.0),0.5));
weft*=0.8+0.35*smoothstep(-0.5,0.5,uv.y);
weft=mix(weft,vec3(0.90,0.67,0.25),m);
vec3 warpC=vec3(0.42,0.52,0.60);
warpC=mix(warpC,vec3(0.90,0.44,0.36),step(abs(mod(id.x,10.0)-2.0),0.5)*0.8);
warpC=mix(warpC,vec3(0.94,0.45,0.34),m);
warpC=mix(warpC,vec3(0.95,0.84,0.60),ring);
warpC=mix(warpC,vec3(0.78,0.90,0.96),clamp(rain,0.0,1.0));
vec3 topC=mix(weft,warpC,w);
vec3 botC=mix(warpC,weft,w);
float acr=mix(f.y,f.x,w);
float alg=mix(f.x,f.y,w);
float cov=prof(acr);
float sh=0.72+0.38*(1.0-4.0*acr*acr);
sh*=0.82+0.18*smoothstep(0.5,0.15,abs(alg));
float covB=prof(alg);
vec3 under=botC*0.5*(0.6+0.4*(1.0-4.0*alg*alg))*covB+vec3(0.04,0.05,0.08)*(1.0-covB);
vec3 col=mix(under,topC*sh,cov);
col+=0.06*(1.0-4.0*acr*acr)*cov;
col+=vec3(0.05,0.04,0.02)*m*(0.5+0.5*sin(t*0.5));
vec2 vg=uv*vec2(0.6,1.0);
col*=1.0-0.35*dot(vg,vg);
col=max(col,vec3(0.03,0.04,0.06));
gl_FragColor=vec4(col,1.0);
}
这一幅没能在你的浏览器里编译。
源码cell mosaic: per-cell center sampling with luminance-sized circle/diamond/cross SDF tiles and dark grout gaps
precision mediump float;
uniform vec2 u_resolution;
uniform float u_time;
const float CELL = 0.0625;
const float HOR = -0.2;
float h(vec2 p){ return fract(sin(dot(p, vec2(127.1, 311.7))) * 43758.5453); }
float blob(vec2 p, vec2 c, float r){ vec2 d = p - c; return exp(-dot(d, d) / (r * r)); }
float box(vec2 p, vec2 b){ vec2 q = abs(p) - b; return length(max(q, 0.0)) + min(max(q.x, q.y), 0.0); }
float clouds(vec2 p, float t){
float c = blob(p, vec2(-0.28 + 0.05 * sin(t * 0.07), 0.24), 0.28);
c += 0.8 * blob(p, vec2(0.18 + 0.04 * sin(t * 0.05 + 1.0), 0.3), 0.32);
c += 0.6 * blob(p, vec2(0.62 + 0.05 * sin(t * 0.06 + 2.0), 0.2), 0.26);
c += 0.5 * blob(p, vec2(-0.75 + 0.04 * sin(t * 0.04 + 3.0), 0.12), 0.24);
return clamp(c, 0.0, 1.0);
}
void scene(vec2 p, vec2 id, float t, out vec3 col, out float wr, out float wx){
wr = 0.0; wx = 0.0;
if (p.y > HOR) {
float g = smoothstep(-0.3, 0.5, p.y);
col = mix(vec3(0.36, 0.42, 0.46), vec3(0.6, 0.64, 0.65), g);
col += vec3(0.2, 0.12, 0.04) * blob(p, vec2(0.1, 0.1), 0.22) * 0.6;
col = mix(col, vec3(0.8, 0.8, 0.76), clouds(p, t) * 0.55);
float r = h(vec2(id.x, 7.0));
float sp = 0.3 + 0.2 * r;
float f = fract((p.y + t * sp) / 1.3 + r);
float rain = smoothstep(0.0, 0.04, f) * exp(-f * 7.0);
rain *= step(0.4, h(vec2(id.x, 3.0))) * smoothstep(HOR, HOR + 0.1, p.y);
col = mix(col, vec3(0.84, 0.9, 0.93), rain * 0.75);
wr = smoothstep(0.15, 0.45, rain);
} else {
float dy = HOR - p.y;
col = mix(vec3(0.3, 0.37, 0.39), vec3(0.17, 0.23, 0.26), smoothstep(0.0, 0.3, dy));
vec2 m = vec2(p.x, HOR + dy * 1.6);
col = mix(col, vec3(0.55, 0.6, 0.6), clouds(m, t) * 0.3);
float ring = 0.0;
for (int i = 0; i < 4; i++) {
float fi = float(i);
float tt = t / 3.0 + fi * 0.25;
float k = floor(tt);
float age = fract(tt);
vec2 c = vec2(h(vec2(k, fi)) * 1.4 - 0.7, HOR - 0.07 - h(vec2(fi, k)) * 0.16);
vec2 d = p - c; d.y *= 2.6;
float rr = age * 0.34;
float e = (length(d) - rr) / 0.035;
ring += exp(-e * e) * (1.0 - age) * smoothstep(0.0, 0.12, age);
}
ring = clamp(ring, 0.0, 1.0);
col = mix(col, vec3(0.72, 0.8, 0.82), ring * 0.7);
wx = smoothstep(0.2, 0.5, ring);
float lf = smoothstep(0.9, 1.0, h(id + 11.0)) * (0.55 + 0.45 * sin(t * 0.3 + h(id) * 6.28));
col = mix(col, vec3(0.68, 0.4, 0.22), lf * (1.0 - wx));
}
}
void main(){
vec2 uv = (gl_FragCoord.xy - 0.5 * u_resolution) / u_resolution.y;
float t = u_time;
vec2 g = uv / CELL;
vec2 id = floor(g);
vec2 f = fract(g) - 0.5;
vec2 cen = (id + 0.5) * CELL;
vec3 col; float wr; float wx;
scene(cen, id, t, col, wr, wx);
float lum = dot(col, vec3(0.3, 0.59, 0.11));
float s = 0.17 + 0.27 * lum;
float dc = length(f) - s;
float dd = (abs(f.x) + abs(f.y)) - s * 1.25;
float dx = min(box(f, vec2(s * 1.05, s * 0.36)), box(f, vec2(s * 0.36, s * 1.05)));
float d = mix(mix(dc, dd, wr), dx, wx);
float aa = 1.3 / (u_resolution.y * CELL);
float m = 1.0 - smoothstep(-aa, aa, d);
vec3 bg = mix(vec3(0.12, 0.15, 0.17), col * 0.4, 0.45);
vec3 tile = col * (1.06 - 0.35 * dot(f, f)) + 0.05 * (f.y - f.x) * 0.5;
vec3 c = mix(bg, tile, m);
c *= 1.0 - 0.18 * dot(uv * vec2(0.7, 1.0), uv * vec2(0.7, 1.0));
gl_FragColor = vec4(c, 1.0);
}
这一幅没能在你的浏览器里编译。
源码three-ink rotated halftone dots with misregistered overprint
precision mediump float;
uniform vec2 u_resolution;
uniform float u_time;
float hash(vec2 p){ return fract(sin(dot(p, vec2(127.1, 311.7))) * 43758.5453); }
float noise(vec2 p){
vec2 i = floor(p);
vec2 f = fract(p);
f = f * f * (3.0 - 2.0 * f);
return mix(mix(hash(i), hash(i + vec2(1.0, 0.0)), f.x),
mix(hash(i + vec2(0.0, 1.0)), hash(i + vec2(1.0, 1.0)), f.x), f.y);
}
float fbm(vec2 p){
float v = 0.0;
float a = 0.5;
for (int i = 0; i < 3; i++){
v += a * noise(p);
p = p * 2.03 + vec2(1.7, 9.2);
a *= 0.5;
}
return v;
}
vec2 rot(vec2 v, float a){
float c = cos(a);
float s = sin(a);
return vec2(c * v.x - s * v.y, s * v.x + c * v.y);
}
vec3 scene(vec2 p){
float t = u_time;
float n = fbm(p * vec2(1.6, 2.6) + vec2(t * 0.02, 0.0));
vec2 sp = vec2(0.18, 0.13);
float dg = length((p - sp) * vec2(0.8, 1.3));
float gap = smoothstep(0.30, 0.07, dg);
float cloud = smoothstep(0.38, 0.62, n + 0.18 * p.y) * (1.0 - gap);
float farY = -0.17 + 0.04 * sin(p.x * 2.1 + 0.6) + 0.02 * sin(p.x * 5.3 + 2.0);
float nearY = -0.30 + 0.05 * sin(p.x * 3.0 + 1.0) + 0.025 * sin(p.x * 7.3);
float far = smoothstep(0.02, -0.02, p.y - farY);
float near = smoothstep(0.02, -0.02, p.y - nearY);
far *= 1.0 - near;
float glow = exp(-dg * dg * 14.0);
float core = exp(-dg * dg * 80.0);
float sky = 1.0 - max(far, near);
float A = sky * (0.10 + 0.62 * cloud * (0.6 + 0.4 * smoothstep(-0.2, 0.5, p.y))) + 0.42 * far + 0.12 * near;
float B = sky * (0.45 * glow * (1.0 - 0.5 * cloud) + 0.10 * cloud - 0.30 * core) + 0.28 * far + 0.72 * near;
float C = sky * (0.24 + 0.50 * glow - 0.10 * cloud - 0.30 * core) + 0.30 * far + 0.62 * near;
return clamp(vec3(A, B, C), 0.0, 1.0);
}
float halftone(vec2 p, float ang, float cs, vec3 mask, float px){
vec2 q = rot(p, -ang) / cs;
vec2 id = floor(q) + 0.5;
vec2 f = q - id;
vec2 c = rot(id * cs, ang);
float d = clamp(dot(scene(c), mask), 0.0, 1.0);
float r = sqrt(d) * 0.66 * (1.0 + 0.08 * sin(dot(c, vec2(3.0, 2.0)) - u_time * 0.9));
float aa = px / cs;
return (1.0 - smoothstep(r - aa, r + aa, length(f))) * smoothstep(0.03, 0.08, d);
}
void main(){
vec2 uv = (gl_FragCoord.xy - 0.5 * u_resolution) / u_resolution.y;
float px = 1.0 / u_resolution.y;
vec3 paper = vec3(0.95, 0.92, 0.85) * (1.0 - 0.06 * length(uv));
float a = halftone(uv, 0.26, 0.042, vec3(1.0, 0.0, 0.0), px);
float b = halftone(uv + vec2(0.011, 0.007), 1.31, 0.042, vec3(0.0, 1.0, 0.0), px);
float y = halftone(uv - vec2(0.006, 0.004), 0.0, 0.05, vec3(0.0, 0.0, 1.0), px);
vec3 col = paper;
col *= mix(vec3(1.0), vec3(0.98, 0.80, 0.32), y);
col *= mix(vec3(1.0), vec3(0.93, 0.42, 0.36), b * 0.92);
col *= mix(vec3(1.0), vec3(0.22, 0.52, 0.62), a * 0.9);
gl_FragColor = vec4(col, 1.0);
}
这一幅没能在你的浏览器里编译。
源码ordered 4x4 Bayer dithering of a soft low-sun cloudscape into a 4-color muted palette
precision mediump float;
uniform vec2 u_resolution;
uniform float u_time;
float h(vec2 p){ return fract(sin(dot(p, vec2(127.1, 311.7))) * 43758.5453); }
float n(vec2 p){
vec2 i = floor(p);
vec2 f = fract(p);
f = f * f * (3.0 - 2.0 * f);
return mix(mix(h(i), h(i + vec2(1.0, 0.0)), f.x), mix(h(i + vec2(0.0, 1.0)), h(i + vec2(1.0, 1.0)), f.x), f.y);
}
float fbm(vec2 p){
float s = 0.0;
float a = 0.5;
for (int i = 0; i < 4; i++) {
s += a * n(p);
p = p * 2.03 + vec2(1.7, 9.2);
a *= 0.5;
}
return s;
}
float b2(vec2 a){
a = mod(a, 2.0);
return fract(a.x * 0.5 + a.y * a.y * 0.75);
}
float b4(vec2 a){
return b2(floor(a * 0.5)) * 0.25 + b2(a);
}
void main(){
float cell = max(2.0, floor(u_resolution.y / 150.0));
vec2 c = floor(gl_FragCoord.xy / cell);
vec2 uv = ((c + 0.5) * cell - 0.5 * u_resolution) / u_resolution.y;
float t = u_time;
vec2 sp = vec2(0.14, -0.03);
float d = length((uv - sp) * vec2(1.0, 1.15));
float breath = 0.5 + 0.5 * sin(t * 0.25);
float v = mix(0.6, 0.3, smoothstep(-0.2, 0.5, uv.y));
float glow = 0.42 * exp(-d * d * 16.0) + 0.14 * exp(-d * 4.0);
v += glow * (0.85 + 0.15 * breath);
v += 0.25 * smoothstep(0.075, 0.062, d);
float w = n(vec2(uv.x * 2.0 + t * 0.01, uv.y * 3.0));
float cl = fbm(vec2(uv.x * 1.6 - t * 0.02, uv.y * 5.0) + 0.6 * w);
float m = smoothstep(0.45, 0.68, cl) * smoothstep(-0.22, 0.02, uv.y);
m *= 1.0 - 0.5 * exp(-d * d * 30.0);
float lit = exp(-d * 3.0);
v = mix(v, 0.26 + 0.32 * lit, m * 0.85);
float rim = smoothstep(0.38, 0.48, cl) - smoothstep(0.5, 0.62, cl);
v += 0.22 * rim * lit * smoothstep(-0.22, 0.0, uv.y);
v += 0.08 * exp(-pow((uv.y + 0.19) * 12.0, 2.0));
for (int k = 0; k < 3; k++) {
float fk = float(k);
float yk = -0.17 - fk * 0.085 + 0.045 * n(vec2(uv.x * (2.2 + fk * 0.8) + fk * 3.1 + t * 0.004 * (fk + 1.0), fk * 5.0));
float hill = smoothstep(yk + 0.006, yk - 0.006, uv.y);
float tone = 0.46 - fk * 0.13 + 0.12 * exp(-abs(uv.x - sp.x) * 3.0) * (1.0 - fk * 0.3);
v = mix(v, tone, hill);
}
v = clamp(v, 0.0, 1.0);
float idx = clamp(floor(v * 3.0 + b4(c)), 0.0, 3.0);
vec3 c0 = vec3(0.20, 0.25, 0.30);
vec3 c1 = vec3(0.42, 0.43, 0.50);
vec3 c2 = vec3(0.74, 0.62, 0.54);
vec3 c3 = vec3(0.90, 0.85, 0.76);
vec3 col = c0;
col = mix(col, c1, step(0.5, idx));
col = mix(col, c2, step(1.5, idx));
col = mix(col, c3, step(2.5, idx));
gl_FragColor = vec4(col, 1.0);
}
这一幅没能在你的浏览器里编译。
源码linocut bands: 4-level noise-carved luminance quantization with tapered ridge-following gouge lines in two-ink print
precision mediump float;
uniform vec2 u_resolution;
uniform float u_time;
const vec3 PAPER = vec3(0.925, 0.885, 0.795);
const vec3 INK = vec3(0.165, 0.205, 0.255);
const vec3 INK2 = vec3(0.70, 0.54, 0.42);
float h(vec2 p){ return fract(sin(dot(p, vec2(127.1, 311.7))) * 43758.5453); }
float n2(vec2 p){
vec2 i = floor(p); vec2 f = fract(p); f = f * f * (3.0 - 2.0 * f);
return mix(mix(h(i), h(i + vec2(1.0, 0.0)), f.x), mix(h(i + vec2(0.0, 1.0)), h(i + vec2(1.0, 1.0)), f.x), f.y);
}
float fbm(vec2 p){
float s = 0.0; float a = 0.5;
for (int i = 0; i < 4; i++){ s += a * n2(p); p = p * 2.03 + vec2(1.7, 9.2); a *= 0.5; }
return s;
}
vec3 shade(float q, float l0, float l1){
if (q < 0.5) return mix(INK, PAPER, l0);
if (q < 1.5) return mix(INK, PAPER, l1);
if (q < 2.5) return INK2;
return PAPER;
}
void main(){
vec2 uv = (gl_FragCoord.xy - 0.5 * u_resolution) / u_resolution.y;
float t = u_time;
float px = 1.0 / u_resolution.y;
float x = uv.x;
float r1 = -0.07 + 0.035 * sin(x * 2.3 + 0.5) + 0.04 * (n2(vec2(x * 2.5, 3.0)) - 0.5);
float r2 = -0.19 + 0.06 * sin(x * 1.5 - 1.2) + 0.05 * (n2(vec2(x * 2.0, 7.0)) - 0.5);
float r3 = -0.33 + 0.07 * sin(x * 2.1 + 2.4) + 0.04 * (n2(vec2(x * 1.7, 11.0)) - 0.5);
vec2 s = vec2(0.2, 0.1);
float d = length(uv - s);
float c = fbm(vec2(x * 1.4 - t * 0.012, uv.y * 5.0));
float L = 0.6 - 0.55 * uv.y + 0.45 * exp(-d * 5.0) - 0.4 * (c - 0.5) + 0.45 * smoothstep(0.08, 0.07, d);
float bar = smoothstep(0.034, 0.012, abs(uv.y - 0.112 - 0.02 * sin(x * 2.5 - t * 0.04)));
L = mix(L, 0.6, bar);
float sp = 0.036;
float hc = (uv.y + 0.06 * x + 0.015 * sin(x * 5.0 + t * 0.08)) / sp;
if (uv.y < r1){
L = 0.56 + 0.16 * smoothstep(0.04, 0.0, r1 - uv.y) * (0.5 + 0.5 * exp(-abs(x - 0.2) * 3.0));
hc = (uv.y - r1) / sp;
}
if (uv.y < r2){
L = 0.38 + 0.12 * smoothstep(0.03, 0.0, r2 - uv.y) - 0.12 * n2(vec2(x * 3.0, uv.y * 8.0));
hc = (uv.y - r2) / sp;
}
if (uv.y < r3){
L = 0.22 + 0.12 * (uv.y + 0.5) - 0.1 * n2(vec2(x * 2.5 + 4.0, uv.y * 6.0));
L += 0.32 * exp(-pow((x - 0.2 - 0.02 * sin(uv.y * 14.0 + t * 0.1)) * 6.0, 2.0)) * smoothstep(0.0, 0.05, r3 - uv.y);
hc = (uv.y - r3 + 0.01 * sin(x * 3.0)) / sp;
}
float e = (n2(uv * vec2(2.5, 5.0) + vec2(t * 0.02, 0.0)) - 0.5) * 0.14 + (n2(uv * 11.0 + 7.0) - 0.5) * 0.06;
float v = clamp((L + e) * 4.0, 0.0, 3.999);
float row = floor(hc);
float f = abs(fract(hc) - 0.5);
float g = n2(vec2(x * 3.5 + row * 5.3, row * 1.7 + 0.5));
float aa = 1.2 * px / sp;
float w1 = 0.24 * smoothstep(0.2, 0.55, g);
float w0 = 0.19 * smoothstep(0.5, 0.75, g);
float l1 = clamp((w1 - f) / aa, 0.0, 1.0);
float l0 = clamp((w0 - f) / aa, 0.0, 1.0);
float q0 = floor(v);
float fr = fract(v);
vec3 col = mix(shade(q0, l0, l1), shade(q0 + 1.0, l0, l1), smoothstep(0.95, 1.0, fr));
col = mix(col, PAPER * 0.96, 0.08 * smoothstep(0.5, 0.9, n2(uv * 11.0 + 3.0)));
col *= 1.0 - 0.07 * dot(uv, uv);
gl_FragColor = vec4(col, 1.0);
}
这一幅没能在你的浏览器里编译。
源码moiré gratings: two drifting concentric ring sets and a tilted line grating multiplied as transparent sheets, with analytic beat-fringe coloring
precision mediump float;
uniform vec2 u_resolution;
uniform float u_time;
const float TAU = 6.2831853;
float grate(float ph, float aa) {
float s = abs(fract(ph) - 0.5) * 2.0;
return smoothstep(0.5 - aa, 0.5 + aa, s);
}
void main() {
vec2 uv = (gl_FragCoord.xy - 0.5 * u_resolution) / u_resolution.y;
float t = u_time;
float px = 1.0 / u_resolution.y;
vec2 c1 = vec2(-0.2 + 0.04 * sin(t * 0.07), 0.06 + 0.03 * cos(t * 0.05));
vec2 c2 = vec2(0.22 + 0.03 * cos(t * 0.06), -0.05 + 0.03 * sin(t * 0.08));
const float p1 = 0.050;
const float p2 = 0.054;
const float p3 = 0.047;
float d1 = length(uv - c1);
float d2 = length(uv - c2);
float ph1 = d1 / p1 - t * 0.12;
float ph2 = d2 / p2 - t * 0.10;
vec2 dir = normalize(vec2(1.0, 0.18));
float ph3 = dot(uv, dir) / p3 + t * 0.05;
float g1 = grate(ph1, 3.0 * px / p1);
float g2 = grate(ph2, 3.0 * px / p2);
float g3 = grate(ph3, 3.0 * px / p3);
float b12 = 0.5 + 0.5 * cos(TAU * (ph1 - ph2));
float b13 = 0.5 + 0.5 * cos(TAU * (ph1 - ph3));
float b23 = 0.5 + 0.5 * cos(TAU * (ph2 - ph3));
vec3 deep = vec3(0.17, 0.23, 0.28);
vec3 mist = vec3(0.64, 0.70, 0.72);
vec3 sage = vec3(0.47, 0.57, 0.54);
vec3 ochre = vec3(0.74, 0.55, 0.38);
float sky = 0.5 + 0.5 * uv.y;
vec3 col = mix(deep, mix(sage, mist, sky), 0.30 + 0.45 * b12);
col = mix(col, mist, 0.12 * b13 + 0.08 * b23);
float glow = exp(-dot(uv * vec2(0.8, 1.2), uv * vec2(0.8, 1.2)) * 3.0);
col = mix(col, ochre, 0.20 * b12 * b23 * glow);
col *= mix(1.0, 0.80, g1);
col *= mix(1.0, 0.82, g2);
col *= mix(1.0, 0.90, g3);
float band = uv.x * 0.45 + uv.y - 0.12 * sin(t * 0.05);
col += vec3(0.05, 0.06, 0.065) * smoothstep(0.28, 0.0, abs(band));
col *= 0.86 + 0.22 * sky;
vec2 v = uv * vec2(0.55, 1.0);
col *= 1.0 - 0.45 * dot(v, v);
col = max(col, vec3(0.08, 0.10, 0.12));
gl_FragColor = vec4(col, 1.0);
}
这一幅没能在你的浏览器里编译。
源码8-fold kaleidoscope mirror folding with stained-glass SDF panes, outward-flowing ring tiles and lead outlines, slow rotation, faint wet sheen
precision mediump float;
uniform vec2 u_resolution;
uniform float u_time;
const float SEG = 0.7853982;
const vec3 LEAD = vec3(0.17, 0.15, 0.30);
const vec3 CORAL = vec3(0.93, 0.42, 0.36);
const vec3 SAFFRON = vec3(0.97, 0.74, 0.22);
const vec3 TEAL = vec3(0.08, 0.50, 0.54);
const vec3 MINT = vec3(0.45, 0.80, 0.66);
const vec3 PLUM = vec3(0.42, 0.27, 0.52);
float hash(vec2 p) { return fract(sin(dot(p, vec2(127.1, 311.7))) * 43758.5453); }
float noise(vec2 p) {
vec2 i = floor(p); vec2 f = fract(p);
f = f * f * (3.0 - 2.0 * f);
return mix(mix(hash(i), hash(i + vec2(1.0, 0.0)), f.x), mix(hash(i + vec2(0.0, 1.0)), hash(i + vec2(1.0, 1.0)), f.x), f.y);
}
mat2 rot(float a) { float c = cos(a); float s = sin(a); return mat2(c, -s, s, c); }
float sdBox(vec2 p, vec2 b) { vec2 d = abs(p) - b; return length(max(d, 0.0)) + min(max(d.x, d.y), 0.0); }
vec3 ringCol(float k) {
vec3 c = vec3(0.86, 0.93, 0.86);
c = mix(c, vec3(0.99, 0.86, 0.76), step(0.5, k));
c = mix(c, vec3(0.99, 0.94, 0.72), step(1.5, k));
c = mix(c, vec3(0.80, 0.90, 0.96), step(2.5, k));
return c;
}
vec3 layer(vec3 col, float d, vec3 c, float aa) {
float fill = 1.0 - smoothstep(-aa, aa, d);
col = mix(col, c, fill);
float edge = 1.0 - smoothstep(0.007, 0.007 + aa, abs(d));
return mix(col, LEAD, edge);
}
float gloss(vec2 q, float rad) {
return 0.22 * (1.0 - smoothstep(0.0, rad * 0.45, length(q - vec2(rad * 0.3, rad * 0.3))));
}
void main() {
vec2 uv = (gl_FragCoord.xy - 0.5 * u_resolution) / u_resolution.y;
float t = u_time;
float aa = 1.5 / u_resolution.y;
float r = length(uv);
float ang = atan(uv.y, uv.x) + t * 0.05;
float sid = floor(ang / SEG);
float a2 = abs(mod(ang, SEG) - 0.5 * SEG);
vec2 p = r * vec2(cos(a2), sin(a2));
vec2 spoke = vec2(0.9239, 0.3827);
float ring = r * 6.0 - t * 0.1;
float rid = floor(ring);
vec3 col = ringCol(mod(rid, 4.0));
col *= 0.92 + 0.08 * mod(rid + sid, 2.0);
float rl = min(fract(ring), 1.0 - fract(ring)) / 6.0;
float el = r * sin(0.5 * SEG - a2);
float grid = min(rl, el);
col = mix(col, LEAD, 0.6 * (1.0 - smoothstep(0.006, 0.006 + aa, grid)));
float br = 0.5 + 0.5 * sin(t * 0.5);
vec2 q = p - vec2(0.13 + 0.01 * br, 0.0);
col = layer(col, length(q) - 0.055, CORAL, aa);
col += gloss(q, 0.055);
col = layer(col, r - 0.05, SAFFRON, aa);
col = layer(col, r - 0.02, TEAL, aa);
vec2 dq = rot(t * 0.15) * (p - vec2(0.24, 0.0));
col = layer(col, sdBox(dq, vec2(0.032)) - 0.005, SAFFRON, aa);
col = layer(col, sdBox(dq, vec2(0.011)), CORAL, aa);
vec2 cq = p - (0.22 + 0.008 * sin(t * 0.35)) * spoke;
col = layer(col, length(cq) - 0.028, MINT, aa);
col += gloss(cq, 0.028);
vec2 lq = p - vec2(0.34 + 0.01 * sin(t * 0.4 + 1.0), 0.0);
float lens = max(length(lq - vec2(0.0, -0.038)), length(lq + vec2(0.0, -0.038))) - 0.05;
col = layer(col, lens, TEAL, aa);
col += 0.15 * (1.0 - smoothstep(0.0, 0.012, length(lq - vec2(0.012, 0.0))));
vec2 oq = p - 0.40 * spoke;
col = layer(col, length(oq) - 0.02, CORAL, aa);
col = layer(col, abs(r - 0.46) - 0.008, PLUM, aa);
float fade = smoothstep(0.47, 0.95, r);
col = mix(col, mix(col, vec3(0.62, 0.70, 0.80), 0.45), fade);
float n = noise(uv * 1.8 + vec2(t * 0.03, t * 0.01));
col *= 0.9 + 0.1 * n;
float sh = sin(dot(uv, vec2(0.8, 0.6)) * 2.5 - t * 0.15);
col += 0.07 * smoothstep(0.6, 1.0, sh);
col *= 1.0 - 0.18 * smoothstep(0.6, 1.1, r);
gl_FragColor = vec4(col, 1.0);
}
这一幅没能在你的浏览器里编译。
源码luminance hatching: three-angle variable-width engraved line sets gated by brightness, ridge-following contour hatching, rotating radial sun rays
precision mediump float;
uniform vec2 u_resolution;
uniform float u_time;
const float P = 0.045;
const vec3 PAPER = vec3(0.96, 0.94, 0.885);
const vec3 INK = vec3(0.11, 0.19, 0.36);
vec2 hill(float x, float k) {
float a = 2.9 - k * 0.6;
float b = 6.8 - k * 1.0;
float p = k * 1.9 + 0.5;
float base = -0.04 - k * 0.135;
float A = 0.055 + 0.008 * k;
float B = 0.028;
float h = base + A * sin(x * a + p) + B * sin(x * b + p * 1.7);
float d = A * a * cos(x * a + p) + B * b * cos(x * b + p * 1.7);
return vec2(h, d);
}
float hatch(float c, float dark, float t0, float px) {
float g = smoothstep(t0, t0 + 0.08, dark);
float k = clamp((dark - t0) / 0.3, 0.0, 1.0);
float hw = mix(max(1.1, 0.06 * P * px), 0.3 * P * px, k);
float f = abs(fract(c / P) - 0.5) * P * px;
return g * (1.0 - smoothstep(hw - 0.7, hw + 0.7, f));
}
float line(float d, float hw, float px) {
float f = d * px;
return 1.0 - smoothstep(hw - 0.7, hw + 0.7, f);
}
void main() {
vec2 uv = (gl_FragCoord.xy - 0.5 * u_resolution) / u_resolution.y;
float t = u_time;
float px = u_resolution.y;
vec2 sun = vec2(0.3, 0.2 + 0.006 * sin(t * 0.2));
vec2 ds = uv - sun;
float r = length(ds);
float lum = 0.97 - 0.42 * smoothstep(0.09, 0.95, r) - 0.08 * uv.y;
float c1 = uv.y + 0.01 * sin(uv.x * 5.0 - t * 0.35) + 0.006 * sin(uv.x * 11.0 + t * 0.2);
vec3 tint = mix(vec3(0.86, 0.92, 0.97), vec3(1.0, 0.95, 0.86), smoothstep(0.4, 0.05, r));
float ink = 0.0;
float fade = 0.35;
vec2 cp = vec2(-0.38 + 0.03 * sin(t * 0.07), 0.27);
vec2 q = uv - cp;
float cd = min(length(q * vec2(1.0, 1.5)) - 0.07, length(q - vec2(0.07, -0.015)) - 0.045);
cd = min(cd, length(q + vec2(0.075, 0.02)) - 0.04);
cd = max(cd, -q.y - 0.035);
if (cd < 0.0) {
lum = 0.95 - 0.55 * smoothstep(0.03, -0.035, q.y);
tint = vec3(1.0, 0.98, 0.95);
}
ink = max(ink, line(abs(cd), 1.2, px));
if (r < 0.07) {
lum = 1.0;
tint = vec3(1.0, 0.84, 0.62);
}
ink = max(ink, line(abs(r - 0.07), 1.3, px));
float seg = 6.2831853 / 18.0;
float a = atan(ds.y, ds.x) + t * 0.04;
float id = floor(a / seg);
float da = (fract(a / seg) - 0.5) * seg;
float rl = mod(id, 2.0) < 0.5 ? 0.2 : 0.155;
float rhw = mix(2.2, 1.1, smoothstep(0.1, rl, r));
ink = max(ink, line(abs(da) * r, rhw, px) * step(0.095, r) * smoothstep(rl, rl - 0.01, r));
for (int i = 0; i < 3; i++) {
float fk = float(i);
vec2 h = hill(uv.x, fk);
if (uv.y < h.x) {
float sl = -h.y / sqrt(1.0 + h.y * h.y);
lum = 0.8 - fk * 0.18 + 0.18 * sl - (h.x - uv.y) * 0.4;
c1 = uv.y - h.x;
tint = mix(vec3(0.98, 0.88, 0.7), vec3(0.9, 0.64, 0.47), fk * 0.5);
ink = 0.0;
fade = 0.3 - fk * 0.15;
}
float rd = abs(uv.y - h.x) / sqrt(1.0 + h.y * h.y);
ink = max(ink, line(rd, 1.3, px));
}
float v = length(uv * vec2(0.75, 1.0));
lum -= 0.16 * smoothstep(0.45, 0.95, v);
float dark = 1.0 - lum;
float s1 = hatch(c1, dark, 0.15, px);
float s2 = hatch(dot(uv, vec2(cos(0.75), sin(0.75))), dark, 0.42, px);
float s3 = hatch(dot(uv, vec2(cos(-0.6), sin(-0.6))), dark, 0.64, px);
float cover = 1.0 - (1.0 - s1) * (1.0 - s2) * (1.0 - s3) * (1.0 - ink);
vec3 paper = PAPER * tint;
paper *= 1.0 - 0.03 * sin(uv.x * 3.0 + uv.y * 2.0);
vec3 inkCol = mix(INK, vec3(0.42, 0.52, 0.68), max(fade, 0.0));
vec3 col = mix(paper, inkCol, cover * 0.9);
gl_FragColor = vec4(col, 1.0);
}
这一幅没能在你的浏览器里编译。
源码parallax jittered-grid lens-shaped leaves with 3D flip squash and rotation, wind sway drift, fbm puff clouds and sun glow
precision mediump float;
uniform vec2 u_resolution;
uniform float u_time;
float h(vec2 p){return fract(sin(dot(p,vec2(127.1,311.7)))*43758.5453);}
float n(vec2 p){vec2 i=floor(p),f=fract(p);f=f*f*(3.0-2.0*f);return mix(mix(h(i),h(i+vec2(1.0,0.0)),f.x),mix(h(i+vec2(0.0,1.0)),h(i+vec2(1.0,1.0)),f.x),f.y);}
float fbm(vec2 p){float s=0.0,a=0.5;for(int i=0;i<4;i++){s+=a*n(p);p=p*2.03+vec2(1.7,9.2);a*=0.5;}return s;}
void main(){
vec2 uv=(gl_FragCoord.xy-0.5*u_resolution)/u_resolution.y;
float t=u_time;
vec3 top=vec3(0.18,0.42,0.78);
vec3 bot=vec3(0.64,0.81,0.92);
vec3 col=mix(bot,top,smoothstep(-0.5,0.55,uv.y));
vec2 sp=vec2(-0.55,0.42);
float sd=length(uv-sp);
col+=vec3(1.0,0.85,0.55)*(0.32*exp(-sd*4.0)+0.14*exp(-sd*1.2));
vec2 cp=uv*vec2(1.6,3.0)+vec2(t*0.03,0.0);
float c=fbm(cp*1.5);
c=smoothstep(0.58,0.75,c)*smoothstep(-0.2,0.3,uv.y);
col=mix(col,vec3(0.97,0.94,0.9),c*0.8);
vec3 sky=col;
for(int L=0;L<3;L++){
float fl=float(L);
float s=6.0-fl*1.75;
float v=0.35+fl*0.3;
vec2 p=uv*s+vec2(-t*v*0.6,t*v*0.35);
p.x+=0.25*sin(p.y*0.8+t*0.7+fl);
p+=fl*vec2(3.1,7.7);
vec2 id=floor(p);
vec2 f=fract(p)-0.5;
float r=h(id+fl*13.0);
if(r>0.5){
vec2 j=(vec2(h(id+3.1),h(id+7.3))-0.5)*0.3;
vec2 q=f-j;
float dir=h(id+1.0)>0.5?1.0:-1.0;
float a=r*12.0+t*(0.3+r*0.4)*dir;
float ca=cos(a),sa=sin(a);
q=mat2(ca,-sa,sa,ca)*q;
float spin=t*(0.6+h(id+5.0)*0.9)+r*20.0;
float cs=cos(spin);
float sq=max(abs(cs),0.3);
q.x/=sq;
float d=max(length(q-vec2(0.15,0.0)),length(q+vec2(0.15,0.0)))-0.22;
float aa=1.5*s/u_resolution.y;
float m=smoothstep(aa,-aa,d*sq);
float k=h(id+9.0);
vec3 lc=k<0.3?vec3(0.97,0.72,0.18):(k<0.6?vec3(0.94,0.44,0.14):(k<0.85?vec3(0.80,0.22,0.17):vec3(0.72,0.70,0.24)));
lc*=mix(0.82,1.08,smoothstep(-0.2,0.2,q.y+q.x*0.5));
lc=cs<0.0?mix(lc,vec3(0.95,0.85,0.6),0.3):lc;
lc*=0.82+0.18*smoothstep(0.0,0.05,abs(q.x));
lc=mix(lc,sky,0.45-fl*0.2);
col=mix(col,lc,m);
}
}
vec2 vu=gl_FragCoord.xy/u_resolution-0.5;
col*=1.0-0.25*dot(vu,vu);
col=mix(col,col*vec3(1.03,1.0,0.95),0.5);
gl_FragColor=vec4(clamp(col,0.0,1.0),1.0);
}
这一幅没能在你的浏览器里编译。
源码dappled komorebi light: fbm canopy gap mask with jittered-grid elliptical pinhole sun disks, eased sway and drifting fbm cloud dimming
precision mediump float;
uniform vec2 u_resolution;
uniform float u_time;
float h(vec2 p){return fract(sin(dot(p,vec2(127.1,311.7)))*43758.5453);}
float n(vec2 p){
vec2 i=floor(p);vec2 f=fract(p);f=f*f*(3.0-2.0*f);
return mix(mix(h(i),h(i+vec2(1.0,0.0)),f.x),mix(h(i+vec2(0.0,1.0)),h(i+vec2(1.0,1.0)),f.x),f.y);
}
float fbm(vec2 p){
float s=0.0;float a=0.5;
for(int i=0;i<4;i++){s+=a*n(p);p=p*2.03+vec2(1.7,9.2);a*=0.5;}
return s;
}
void main(){
vec2 uv=gl_FragCoord.xy/u_resolution;
float asp=u_resolution.x/u_resolution.y;
vec2 p=vec2((uv.x-0.5)*asp,uv.y-0.5);
float t=u_time;
// tilt the projected pattern a little, like light falling at an angle
p=mat2(0.94,-0.34,0.34,0.94)*p;
// slow, lazy sway of branches
vec2 sw=vec2(sin(t*0.23)+0.4*sin(t*0.37+1.0),0.6*cos(t*0.19))*0.06;
// canopy gaps: broad soft patches
float m=fbm(p*2.2+sw+vec2(t*0.01,0.0));
float gap=smoothstep(0.5,0.7,m);
// pinhole sun disks
float spots=0.0;
vec2 q=p*4.5+sw*3.0;
vec2 id=floor(q);
float blur=0.16+0.05*sin(t*0.2);
for(int j=0;j<9;j++){
vec2 o=vec2(mod(float(j),3.0)-1.0,floor(float(j)/3.0)-1.0);
vec2 c=id+o;
float r=h(c);
vec2 ctr=c+0.5+0.18*vec2(sin(t*0.3+r*6.28),cos(t*0.27+r*5.0));
float d=length((q-ctr)*vec2(1.0,1.3));
float sz=0.26+0.16*h(c+3.1);
float on=smoothstep(0.5,0.85,h(c+7.0)+0.25*sin(t*0.35+r*9.0));
spots+=on*smoothstep(sz,sz-blur,d);
}
float light=clamp(gap*0.45+spots*0.75,0.0,1.0);
// thin clouds drifting past the sun
float cl=fbm(p*0.8+vec2(t*0.03,t*0.012));
float cd=smoothstep(0.38,0.68,cl)*0.5;
light*=1.0-cd;
// palette: muted lilac shade, warm honey light
vec3 shade=vec3(0.40,0.38,0.46);
vec3 mid=vec3(0.62,0.54,0.52);
vec3 lit=vec3(0.92,0.79,0.58);
vec3 col=mix(shade,mid,smoothstep(0.0,0.5,light));
col=mix(col,lit,smoothstep(0.4,1.0,light));
// soft warm glow where spots cluster
col+=vec3(0.06,0.03,0.0)*spots;
// gentle vertical gradient and low-frequency wall texture
col*=0.92+0.1*uv.y;
col*=0.96+0.06*n(p*6.0+3.0);
// vignette
vec2 v=uv-0.5;
col*=1.0-0.35*dot(v,v)*1.6;
col=clamp(col,0.05,0.94);
gl_FragColor=vec4(col,1.0);
}
这一幅没能在你的浏览器里编译。
源码terraced fbm topographic map with gradient-scaled contour lines, hillshade, drifting cloud shadows and an animated dashed route to a pulsing marker
precision mediump float;
uniform vec2 u_resolution;
uniform float u_time;
float hash(vec2 p){ return fract(sin(dot(p, vec2(127.1, 311.7))) * 43758.5453); }
float noise(vec2 p){
vec2 i = floor(p); vec2 f = fract(p);
f = f * f * (3.0 - 2.0 * f);
return mix(mix(hash(i), hash(i + vec2(1.0, 0.0)), f.x), mix(hash(i + vec2(0.0, 1.0)), hash(i + vec2(1.0, 1.0)), f.x), f.y);
}
float fbm(vec2 p){
float v = 0.0; float a = 0.5;
for (int i = 0; i < 4; i++) { v += a * noise(p); p = p * 2.03 + vec2(1.7, 9.2); a *= 0.5; }
return v;
}
float terrain(vec2 p, vec2 D){
float h = fbm(p * 2.0 + vec2(3.1, 1.7));
h += 0.28 * exp(-dot(p - D, p - D) * 9.0);
return h;
}
float pathY(float x, vec2 D){
float k = clamp((x + 0.8) / (D.x + 0.8), 0.0, 1.0);
return mix(-0.38, D.y, k) + 0.1 * sin(k * 7.5) * (1.0 - k);
}
void main(){
vec2 uv = gl_FragCoord.xy / u_resolution;
float asp = u_resolution.x / u_resolution.y;
vec2 p = (uv - 0.5) * vec2(asp, 1.0);
float t = u_time;
vec2 D = vec2(0.36, 0.17);
float h = terrain(p, D);
float e = 0.004;
float hx = terrain(p + vec2(e, 0.0), D);
float hy = terrain(p + vec2(0.0, e), D);
float g = length(vec2(hx - h, hy - h)) / e + 0.001;
const float L = 8.0;
float lv = h * L;
float band = floor(lv);
float f = fract(lv);
float dl = min(f, 1.0 - f) / (L * g);
float line = 1.0 - smoothstep(0.004, 0.008, dl);
float b = band / L;
float k = clamp((b - 0.2) / 0.6, 0.0, 1.0);
vec3 c1 = vec3(0.52, 0.62, 0.47);
vec3 c2 = vec3(0.72, 0.70, 0.42);
vec3 c3 = vec3(0.86, 0.66, 0.38);
vec3 c4 = vec3(0.80, 0.46, 0.31);
vec3 c5 = vec3(0.95, 0.88, 0.72);
vec3 col = mix(c1, c2, smoothstep(0.0, 0.3, k));
col = mix(col, c3, smoothstep(0.25, 0.55, k));
col = mix(col, c4, smoothstep(0.5, 0.8, k));
col = mix(col, c5, smoothstep(0.8, 1.0, k));
vec3 n = normalize(vec3(-(hx - h) / e, -(hy - h) / e, 1.5));
float sh = clamp(dot(n, normalize(vec3(-0.5, 0.6, 0.7))), 0.0, 1.0);
col *= 0.82 + 0.28 * sh;
col = mix(col, col * 0.62, line * 0.8);
float c = fbm(p * 1.4 + vec2(-t * 0.035, t * 0.012) + vec2(5.0));
float cs = smoothstep(0.52, 0.72, c);
col = mix(col, col * vec3(0.72, 0.76, 0.86), cs * 0.55);
float yy = pathY(p.x, D);
float s = (pathY(p.x + 0.01, D) - yy) / 0.01;
float dr = abs(p.y - yy) / sqrt(1.0 + s * s);
float kk = (p.x + 0.8) / (D.x + 0.8);
float on = 1.0 - smoothstep(D.x - 0.01, D.x, p.x);
float fd = fract(kk * 18.0 - t * 0.4);
float dash = smoothstep(0.0, 0.08, fd) * smoothstep(0.6, 0.52, fd);
float rw = 1.0 - smoothstep(0.006, 0.011, dr);
vec3 rc = vec3(0.62, 0.16, 0.2);
col = mix(col, vec3(0.98, 0.93, 0.8), (1.0 - smoothstep(0.012, 0.022, dr)) * on * 0.45);
col = mix(col, rc, rw * dash * on);
float kp = fract(t * 0.1);
float px = -0.8 + kp * (D.x + 0.8);
vec2 P = vec2(px, pathY(px, D));
float gp = exp(-dot(p - P, p - P) * 600.0) * smoothstep(0.0, 0.1, kp) * smoothstep(1.0, 0.9, kp);
col += vec3(1.0, 0.75, 0.45) * gp * 0.6;
float r = length(p - D);
float ph = fract(t * 0.22);
float ring = (1.0 - smoothstep(0.004, 0.009, abs(r - (0.025 + 0.07 * ph)))) * (1.0 - ph);
col = mix(col, rc, ring * 0.7);
col = mix(col, vec3(0.98, 0.94, 0.85), 1.0 - smoothstep(0.022, 0.027, r));
col = mix(col, rc, 1.0 - smoothstep(0.013, 0.017, r));
col += vec3(0.06, 0.04, 0.0) * smoothstep(0.8, 0.0, length(p - vec2(-0.5, 0.5)));
col *= 0.85 + 0.15 * smoothstep(1.0, 0.2, length(uv - 0.5) * 1.4);
gl_FragColor = vec4(col, 1.0);
}
这一幅没能在你的浏览器里编译。
源码sliding grid raindrops with trailing droplets acting as inverted lenses over drifting warm bokeh discs, fbm haze and fogged glass
precision mediump float;
uniform vec2 u_resolution;
uniform float u_time;
float hash(vec2 p){return fract(sin(dot(p,vec2(127.1,311.7)))*43758.5453);}
float noise(vec2 p){
vec2 i=floor(p),f=fract(p);f=f*f*(3.0-2.0*f);
return mix(mix(hash(i),hash(i+vec2(1.0,0.0)),f.x),mix(hash(i+vec2(0.0,1.0)),hash(i+vec2(1.0,1.0)),f.x),f.y);
}
float fbm(vec2 p){
float v=0.0,a=0.5;
for(int i=0;i<4;i++){v+=a*noise(p);p=p*2.03+vec2(1.7,9.2);a*=0.5;}
return v;
}
vec3 scene(vec2 p){
vec3 col=mix(vec3(0.30,0.36,0.44),vec3(0.56,0.59,0.64),smoothstep(-0.5,0.6,p.y));
col+=(fbm(p*1.6+vec2(u_time*0.02,0.0))-0.5)*0.14;
vec2 gc=p-vec2(0.12,-0.08);
float g=exp(-dot(gc,gc)*4.5);
col=mix(col,vec3(1.0,0.70,0.40),g*0.55*(0.92+0.08*sin(u_time*0.5)));
for(int i=0;i<9;i++){
float fi=float(i);
vec2 c=vec2((hash(vec2(fi,1.3))-0.5)*1.3,(hash(vec2(fi,7.1))-0.5)*0.9);
c+=0.04*vec2(sin(u_time*0.2+fi),cos(u_time*0.17+fi*1.3));
float r=0.06+0.06*hash(vec2(fi,3.7));
float d=length(p-c);
float disk=1.0-smoothstep(r-0.02,r,d);
float rim=smoothstep(r-0.035,r-0.005,d)*disk;
float h=hash(vec2(fi,5.5));
vec3 bc=mix(vec3(1.0,0.60,0.34),vec3(1.0,0.86,0.56),h);
if(h<0.25) bc=vec3(0.55,0.76,0.80);
col=mix(col,bc,disk*(0.26+0.16*rim)*(0.85+0.15*sin(u_time*0.4+fi*2.0)));
}
return col;
}
vec3 dropLayer(vec2 p,float t,vec2 g,float r){
vec2 q=p*g;
q.y+=t*0.25;
vec2 id=floor(q);
float n=hash(id);
vec2 st=fract(q)-0.5;
float tt=t+n*6.28;
float y=-sin(tt+sin(tt+sin(tt)*0.5))*0.36;
float x=(n-0.5)*0.6+sin(tt*0.7+n*10.0)*0.04;
vec2 d=(st-vec2(x,y))/g;
float m=1.0-smoothstep(r*0.6,r,length(d));
float dy=st.y-y;
float trail=smoothstep(0.0,0.08,dy)*(1.0-smoothstep(0.05,0.45,dy));
vec2 td=vec2(st.x-x,fract(st.y*5.0)-0.5)/vec2(g.x,g.y*5.0);
float rt=r*0.45;
float tm=(1.0-smoothstep(rt*0.55,rt,length(td)))*trail*step(0.3,hash(id+3.1));
return vec3(d*m+td*tm,max(m,tm));
}
void main(){
vec2 p=(gl_FragCoord.xy-0.5*u_resolution)/u_resolution.y;
float t=u_time*0.35;
vec3 a=dropLayer(p,t,vec2(5.0,2.5),0.035);
vec3 b=dropLayer(p+vec2(0.37,0.11),t*0.8+3.0,vec2(8.0,4.0),0.024);
vec2 off=a.xy+b.xy;
float mask=max(a.z,b.z);
vec3 col=scene(p-off*6.0);
vec3 fogc=vec3(0.62,0.66,0.71);
col=mix(col,fogc,0.24*(1.0-mask));
float e=length(off)/0.035;
col*=1.0-0.22*mask*smoothstep(0.45,1.0,e);
vec2 nd=normalize(off+vec2(0.0001));
col+=0.22*mask*smoothstep(0.55,1.0,dot(nd,vec2(-0.7,0.7)))*smoothstep(0.25,0.75,e);
col+=0.04*mask*vec3(1.0,0.85,0.6);
vec2 v=p*vec2(0.8,1.0);
col*=1.0-0.35*dot(v,v);
col=clamp(col,0.0,0.95);
gl_FragColor=vec4(col,1.0);
}
这一幅没能在你的浏览器里编译。
源码Rothko-style soft-edged color field blocks with fbm-feathered borders, horizontal brush-streak modulation, breathing scale, glowing seam and drifting fbm cloud shade
precision mediump float;
uniform vec2 u_resolution;
uniform float u_time;
float hash(vec2 p){return fract(sin(dot(p,vec2(127.1,311.7)))*43758.5453);}
float noise(vec2 p){
vec2 i=floor(p);vec2 f=fract(p);f=f*f*(3.0-2.0*f);
return mix(mix(hash(i),hash(i+vec2(1.0,0.0)),f.x),mix(hash(i+vec2(0.0,1.0)),hash(i+vec2(1.0,1.0)),f.x),f.y);
}
float fbm(vec2 p){
float v=0.0;float a=0.5;
for(int i=0;i<4;i++){v+=a*noise(p);p=p*2.03+vec2(1.7,9.2);a*=0.5;}
return v;
}
float field(vec2 p,vec2 c,vec2 h,float soft,float t){
vec2 q=abs(p-c)-h;
float d=length(max(q,0.0))+min(max(q.x,q.y),0.0);
d+=(fbm(p*3.0+vec2(t,-t*0.7))-0.5)*0.09;
return 1.0-smoothstep(-soft,soft,d);
}
void main(){
vec2 uv=gl_FragCoord.xy/u_resolution;
float asp=u_resolution.x/u_resolution.y;
vec2 p=(gl_FragCoord.xy-0.5*u_resolution)/u_resolution.y;
float t=u_time*0.05;
float br=sin(u_time*0.35);
// background wash: dusty blue-grey to warm grey
vec3 bg=mix(vec3(0.40,0.43,0.50),vec3(0.60,0.52,0.47),uv.y);
bg*=0.92+0.16*fbm(p*2.0+vec2(t*0.5,0.0));
vec3 col=bg;
// brush streak texture (horizontal, low frequency)
float streak=fbm(vec2(p.x*1.5+t*0.3,p.y*7.0));
// lower heavy field: muted plum-slate
vec2 hb=vec2(asp*0.36,0.15+0.006*br);
float mb=field(p,vec2(0.0,-0.23),hb,0.045,t+3.0);
vec3 cb=mix(vec3(0.33,0.30,0.40),vec3(0.42,0.35,0.42),streak);
col=mix(col,cb,mb*0.95);
// upper warm field: apricot amber
vec2 ht=vec2(asp*0.38,0.17+0.008*br);
float mt=field(p,vec2(0.0,0.19),ht,0.04,t);
vec3 ct=mix(vec3(0.86,0.47,0.27),vec3(0.95,0.66,0.36),streak);
ct=mix(ct,vec3(0.97,0.74,0.45),0.25*smoothstep(0.1,0.35,p.y));
col=mix(col,ct,mt*0.96);
// glowing seam between the fields
float sx=1.0-smoothstep(asp*0.30,asp*0.42,abs(p.x));
float seam=exp(-pow((p.y+0.035)/0.035,2.0))*sx;
col+=vec3(1.0,0.78,0.48)*0.16*seam*(0.85+0.15*br);
// warm low autumn light from upper left
float lg=1.0-smoothstep(0.0,1.3,length(p-vec2(-0.7,0.55)));
col+=vec3(0.10,0.06,0.01)*lg;
// drifting cloud shade (light wind, partly cloudy)
float cs=fbm(p*1.2+vec2(u_time*0.018,u_time*0.004));
float sh=smoothstep(0.48,0.72,cs);
col*=1.0-0.17*sh;
// soft vignette
vec2 v=uv-0.5;
col*=1.0-0.35*dot(v,v)*1.6;
col=clamp(col,0.04,0.95);
gl_FragColor=vec4(col,1.0);
}
这一幅没能在你的浏览器里编译。
源码time-sampled Lissajous metaball trail with hop offsets and detached drop shadow, landing ripple rings, skewed window-light patch with fbm cloud shadow
precision mediump float;
uniform vec2 u_resolution;
uniform float u_time;
float hash(vec2 p){return fract(sin(dot(p,vec2(127.1,311.7)))*43758.5453);}
float noise(vec2 p){
vec2 i=floor(p);vec2 f=fract(p);
vec2 u=f*f*(3.0-2.0*f);
return mix(mix(hash(i),hash(i+vec2(1.0,0.0)),u.x),mix(hash(i+vec2(0.0,1.0)),hash(i+vec2(1.0,1.0)),u.x),u.y);
}
float fbm(vec2 p){
float v=0.0;float a=0.5;
for(int i=0;i<4;i++){v+=a*noise(p);p=p*2.03+vec2(1.7,9.2);a*=0.5;}
return v;
}
vec2 path(float s){
return vec2(0.42*sin(s*1.1)+0.12*sin(s*2.7+1.3),-0.08+0.20*sin(s*1.7+0.4)+0.06*sin(s*3.3));
}
void main(){
vec2 uv=(gl_FragCoord.xy-0.5*u_resolution)/u_resolution.y;
float t=u_time;
vec3 floorA=vec3(0.80,0.66,0.50);
vec3 floorB=vec3(0.62,0.45,0.35);
vec3 col=mix(floorB,floorA,smoothstep(-0.6,0.5,uv.y));
float plank=sin((uv.x+uv.y*0.3)*18.0);
col*=0.95+0.05*smoothstep(-0.9,0.9,plank);
vec2 q=uv;q.x-=q.y*0.45;q-=vec2(0.12,-0.02);
float box=max(abs(q.x)-0.36,abs(q.y)-0.30);
float win=smoothstep(0.03,-0.03,box);
float bars=min(abs(q.x),abs(q.y));
win*=smoothstep(0.012,0.03,bars);
float cl=fbm(uv*1.6+vec2(t*0.05,t*0.01));
float shade=smoothstep(0.55,0.75,cl);
col+=win*(1.0-0.55*shade)*vec3(0.22,0.17,0.09);
float s=t*0.5;
float f=0.0;float sf=0.0;vec3 bc=vec3(0.0);
for(int i=0;i<28;i++){
float fi=float(i);
float k=fi/28.0;
float si=s-fi*0.035;
vec2 p=path(si);
float hop=abs(sin(si*6.0))*0.07*(1.0-k*0.5);
float r=mix(0.075,0.013,k);
vec2 d=uv-p-vec2(0.0,hop);
float w=r*r/(dot(d,d)+2e-4);
f+=w;
bc+=w*mix(vec3(1.0,0.74,0.40),vec3(0.96,0.48,0.42),k);
vec2 ds=uv-p-vec2(0.025,-0.045);
sf+=r*r/(dot(ds,ds)+2e-4)*(1.0-k);
}
col*=1.0-0.28*smoothstep(0.5,1.3,sf);
float ph=fract(s*6.0/3.14159);
vec2 lp=path(s-ph*3.14159/6.0)+vec2(0.0,-0.01);
vec2 rd=uv-lp;rd.y*=1.8;
float rr=length(rd);
float ringR=0.05+ph*0.17;
float ring=smoothstep(0.018,0.004,abs(rr-ringR));
col=mix(col,vec3(1.0,0.90,0.72),ring*(1.0-ph)*(1.0-ph)*0.55);
bc/=(f+1e-3);
float m=smoothstep(0.85,1.15,f);
vec3 b=bc*(0.86+0.2*smoothstep(1.0,4.0,f));
col=mix(col,b,m);
vec2 hp=path(s);hp.y+=abs(sin(s*6.0))*0.07;
float hl=smoothstep(0.03,0.0,length(uv-hp-vec2(-0.022,0.025)));
col+=hl*0.18*vec3(1.0,0.95,0.85);
col*=1.0-0.35*dot(uv*vec2(0.8,1.0),uv*vec2(0.8,1.0));
col=clamp(col,0.0,0.97);
gl_FragColor=vec4(col,1.0);
}