{"history":[{"breakpoints":[],"visible":true,"aspectRatio":1,"layerType":"effect","type":"gradient","speed":0.25,"trackMouse":0,"mouseMomentum":0,"animating":false,"isMask":0,"compiledFragmentShaders":["#version 300 es\nprecision highp float;in vec2 vTextureCoord;uniform vec2 uMousePos; vec3 getColor(int index) { switch(index) { case 0: return vec3(0, 0, 0); case 1: return vec3(0, 0, 0); case 2: return vec3(0, 0, 0); case 3: return vec3(0, 0, 0); case 4: return vec3(0, 0, 0); case 5: return vec3(0, 0, 0); case 6: return vec3(0, 0, 0); case 7: return vec3(0, 0, 0); case 8: return vec3(0, 0, 0); case 9: return vec3(0, 0, 0); case 10: return vec3(0, 0, 0); case 11: return vec3(0, 0, 0); case 12: return vec3(0, 0, 0); case 13: return vec3(0, 0, 0); case 14: return vec3(0, 0, 0); case 15: return vec3(0, 0, 0); default: return vec3(0.0); } }const float PI = 3.14159265;vec2 rotate(vec2 coord, float angle) { float s = sin(angle); float c = cos(angle); return vec2( coord.x * c - coord.y * s, coord.x * s + coord.y * c ); }out vec4 fragColor;vec3 getColor(vec2 uv) {return vec3(0, 0, 0); }void main() { vec2 uv = vTextureCoord; vec2 pos = vec2(0.5, 0.5) + mix(vec2(0), (uMousePos-0.5), 0.00); uv -= pos; uv /= (0.50*2.); uv = rotate(uv, (0.00 - 0.5) * 2. * PI); vec4 color = vec4(getColor(uv), 1); fragColor = color; }"],"compiledVertexShaders":["#version 300 es\nprecision highp float;in vec3 aVertexPosition; in vec2 aTextureCoord;uniform mat4 uMVMatrix; uniform mat4 uPMatrix;out vec2 vTextureCoord; out vec3 vVertexPosition;void main() { gl_Position = uPMatrix * uMVMatrix * vec4(aVertexPosition, 1.0); vTextureCoord = aTextureCoord; }"],"data":{"depth":false,"uniforms":{}}},{"breakpoints":[],"visible":true,"aspectRatio":1,"layerType":"effect","type":"beam","radius":0.86,"speed":0.25,"trackMouse":0.1,"mouseMomentum":1,"animating":false,"isMask":0,"states":{"appear":[{"type":"appear","id":"16bc630c-4f69-4908-8825-1eadd908ec06","prop":"radius","transition":{"duration":4000,"ease":"easeOutExpo","delay":250},"complete":false,"progress":0,"initialStateSet":false,"value":0,"uniformData":{"type":"1f","name":"uRadius"}}],"scroll":[],"hover":[]},"compiledFragmentShaders":["#version 300 es\nprecision highp float;in vec2 vTextureCoord;uniform sampler2D uTexture;uniform float uRadius;uniform vec2 uMousePos; uniform vec2 uResolution; vec3 blend (int blendMode, vec3 src, vec3 dst) { return src + dst; }vec3 Tonemap_tanh(vec3 x) { x = clamp(x, -40.0, 40.0); return (exp(x) - exp(-x)) / (exp(x) + exp(-x)); }float random(vec2 seed) { vec3 p3 = fract(vec3(seed.xyx) * 0.1031); p3 += dot(p3, p3.yzx + 33.33); return fract((p3.x + p3.y) * p3.z); }out vec4 fragColor;const float PI = 3.14159265359; const float TWO_PI = 2.0 * PI;mat2 rot(float a) { return mat2(cos(a),-sin(a),sin(a),cos(a)); }vec3 drawPoint(vec2 uv, vec2 center, float scale) { uv.x *= uResolution.x/uResolution.y; center.x *= uResolution.x/uResolution.y; vec2 skew = vec2(0.50, 1.-0.50) * 2.; uv = uv * rot(0.16 * TWO_PI) * skew; center = center * rot(0.16 * TWO_PI) * skew; float dist = distance(uv, center); float radius = scale * 0.25;float brightness = radius / dist; return brightness * vec3(0.39215686274509803, 0.39215686274509803, 0.39215686274509803); }vec3 getBeam(vec2 uv) { vec2 pos = vec2(0.5, 0.5) + mix(vec2(0), (uMousePos-0.5), 0.10); return drawPoint(uv, pos, uRadius); }void main() { vec2 uv = vTextureCoord; vec4 bg = texture(uTexture, uv);vec3 beam = getBeam(uv); float dither = (random(gl_FragCoord.xy) - 0.5) / 255.0;vec3 blended = blend(1, Tonemap_tanh(beam), bg.rgb); vec3 result = mix(bg.rgb, blended, 1.00); result += dither;fragColor = vec4(result, bg.a); }"],"compiledVertexShaders":["#version 300 es\nprecision highp float;in vec3 aVertexPosition; in vec2 aTextureCoord;uniform mat4 uMVMatrix; uniform mat4 uPMatrix; uniform mat4 uTextureMatrix;out vec2 vTextureCoord; out vec3 vVertexPosition;void main() { gl_Position = uPMatrix * uMVMatrix * vec4(aVertexPosition, 1.0); vTextureCoord = (uTextureMatrix * vec4(aTextureCoord, 0.0, 1.0)).xy; }"],"data":{"depth":false,"uniforms":{}}},{"breakpoints":[],"visible":true,"aspectRatio":1,"layerType":"effect","type":"gradientMap","speed":0.5,"animating":false,"mouseMomentum":0,"isMask":0,"compiledFragmentShaders":["#version 300 es\nprecision highp float;in vec2 vTextureCoord;uniform sampler2D uTexture;uniform float uTime; vec3 getColor(int index) { switch(index) { case 0: return vec3(0, 0, 0); case 1: return vec3(0.023529411764705882, 0.07450980392156863, 0.12549019607843137); case 2: return vec3(0.0, 0.6196078431372549, 0.8901960784313725); case 3: return vec3(0.0, 0.8784313725490196, 0.7764705882352941); case 4: return vec3(0.6235294117647059, 0.9607843137254902, 0.8901960784313725); case 5: return vec3(0, 0, 0); case 6: return vec3(0, 0, 0); case 7: return vec3(0, 0, 0); case 8: return vec3(0, 0, 0); case 9: return vec3(0, 0, 0); case 10: return vec3(0, 0, 0); case 11: return vec3(0, 0, 0); case 12: return vec3(0, 0, 0); case 13: return vec3(0, 0, 0); case 14: return vec3(0, 0, 0); case 15: return vec3(0, 0, 0); default: return vec3(0.0); } }float rand(vec2 co) { vec3 p3 = fract(vec3(co.xyx) * 0.1031); p3 += dot(p3, p3.yzx + 33.33); return fract((p3.x + p3.y) * p3.z); }vec3 linear_from_srgb(vec3 rgb) { return pow(rgb, vec3(2.2)); }vec3 srgb_from_linear(vec3 lin) { return pow(lin, vec3(1.0/2.2)); }vec3 oklab_mix(vec3 lin1, vec3 lin2, float a) { const mat3 kCONEtoLMS = mat3( 0.4121656120, 0.2118591070, 0.0883097947, 0.5362752080, 0.6807189584, 0.2818474174, 0.0514575653, 0.1074065790, 0.6302613616); const mat3 kLMStoCONE = mat3( 4.0767245293, -1.2681437731, -0.0041119885, -3.3072168827, 2.6093323231, -0.7034763098, 0.2307590544, -0.3411344290, 1.7068625689); vec3 lms1 = pow( kCONEtoLMS*lin1, vec3(1.0/3.0) ); vec3 lms2 = pow( kCONEtoLMS*lin2, vec3(1.0/3.0) ); vec3 lms = mix( lms1, lms2, a ); lms *= 1.0 + 0.02 * a * (1.0 - a); return kLMStoCONE*(lms*lms*lms); }vec3 getGradientColor(float position) { for (int i = 0; i < 5; i++) { float colorPosition = float(i) / float(5); float nextColorPosition = float(i + 1) / float(5); if (position <= nextColorPosition) { float mixFactor = (position - colorPosition) / (nextColorPosition - colorPosition); vec3 linStart = linear_from_srgb(getColor(i)); vec3 linEnd = linear_from_srgb(getColor(i + 1)); vec3 mixedLin = oklab_mix(linStart, linEnd, mixFactor); return srgb_from_linear(mixedLin); } } return srgb_from_linear(getColor(5 - 1)); }out vec4 fragColor;void main() { vec2 uv = vTextureCoord; vec4 color = texture(uTexture, uv); float position = smoothstep(0., 1., color.r) * (0.40 * 2.); float posOffset = (dot(vec2(0.5, 0.5).x, vec2(0.5, 0.5).y) + 0.22 + 0.0001) * 2.; position -= (uTime*0.01 + posOffset); float cycle = floor(position); bool reverse = int(cycle) % 2 == 0; float animatedPos = reverse ? fract(-position) : fract(position); animatedPos = reverse ? animatedPos - 1./float(5) : animatedPos - 1./float(5); animatedPos = clamp(animatedPos, 0. - 1./float(5), 1.0);color.rgb = (getGradientColor(animatedPos)); float dither = rand(gl_FragCoord.xy) * 0.005; color.rgb += dither;fragColor = color; }"],"compiledVertexShaders":["#version 300 es\nprecision highp float;in vec3 aVertexPosition; in vec2 aTextureCoord;uniform mat4 uMVMatrix; uniform mat4 uPMatrix;out vec2 vTextureCoord; out vec3 vVertexPosition;void main() { gl_Position = uPMatrix * uMVMatrix * vec4(aVertexPosition, 1.0); vTextureCoord = aTextureCoord; }"],"data":{"depth":false,"uniforms":{}}},{"breakpoints":[],"visible":true,"aspectRatio":1,"layerType":"effect","type":"noise","speed":0.11,"trackMouse":0,"mouseMomentum":0,"animating":true,"isMask":0,"compiledFragmentShaders":["#version 300 es\nprecision highp float; in vec2 vTextureCoord; in vec3 vVertexPosition;uniform sampler2D uTexture; uniform vec2 uMousePos; uniform vec2 uResolution; float ease (int easingFunc, float t) { return t; }out vec4 fragColor;void main() { vec2 noise = vTextureCoord; vec2 uv = vVertexPosition.xy; float aspectRatio = uResolution.x/uResolution.y;vec2 mPos = vec2(0.5, 0.5) + mix(vec2(0), (uMousePos-0.5), 0.00); vec2 pos = mPos; float dist = ease(0, max(0.,1.-distance(uv * vec2(aspectRatio, 1), mPos * vec2(aspectRatio, 1)) * 4. * (1. - 1.00)));uv = mix(uv, noise, dist);vec4 color = texture(uTexture, uv); fragColor = color;}"],"compiledVertexShaders":["#version 300 es\nprecision highp float;in vec3 aVertexPosition; in vec2 aTextureCoord;uniform mat4 uMVMatrix; uniform mat4 uPMatrix; uniform mat4 uTextureMatrix;out vec3 vVertexPosition; out vec2 vTextureCoord;uniform float uTime; uniform vec2 uMousePos; uniform vec2 uResolution;vec4 permute(vec4 t) { return t * (t * 34.0 + 133.0); }vec3 grad(float hash) { vec3 cube = mod(floor(hash / vec3(1.0, 2.0, 4.0)), 2.0) * 2.0 - 1.0; vec3 cuboct = cube;float index0 = step(0.0, 1.0 - floor(hash / 16.0)); float index1 = step(0.0, floor(hash / 16.0) - 1.0);cuboct.x *= 1.0 - index0; cuboct.y *= 1.0 - index1; cuboct.z *= 1.0 - (1.0 - index0 - index1);float type = mod(floor(hash / 8.0), 2.0); vec3 rhomb = (1.0 - type) * cube + type * (cuboct + cross(cube, cuboct));vec3 grad = cuboct * 1.22474487139 + rhomb;grad *= (1.0 - 0.042942436724648037 * type) * 3.5946317686139184;return grad; } vec4 bccNoiseDerivativesPart(vec3 X) { vec3 b = floor(X); vec4 i4 = vec4(X - b, 2.5); vec3 v1 = b + floor(dot(i4, vec4(.25))); vec3 v2 = b + vec3(1, 0, 0) + vec3(-1, 1, 1) * floor(dot(i4, vec4(-.25, .25, .25, .35))); vec3 v3 = b + vec3(0, 1, 0) + vec3(1, -1, 1) * floor(dot(i4, vec4(.25, -.25, .25, .35))); vec3 v4 = b + vec3(0, 0, 1) + vec3(1, 1, -1) * floor(dot(i4, vec4(.25, .25, -.25, .35))); vec4 hashes = permute(mod(vec4(v1.x, v2.x, v3.x, v4.x), 289.0)); hashes = permute(mod(hashes + vec4(v1.y, v2.y, v3.y, v4.y), 289.0)); hashes = mod(permute(mod(hashes + vec4(v1.z, v2.z, v3.z, v4.z), 289.0)), 48.0); vec3 d1 = X - v1; vec3 d2 = X - v2; vec3 d3 = X - v3; vec3 d4 = X - v4; vec4 a = max(0.75 - vec4(dot(d1, d1), dot(d2, d2), dot(d3, d3), dot(d4, d4)), 0.0); vec4 aa = a * a; vec4 aaaa = aa * aa; vec3 g1 = grad(hashes.x); vec3 g2 = grad(hashes.y); vec3 g3 = grad(hashes.z); vec3 g4 = grad(hashes.w); vec4 extrapolations = vec4(dot(d1, g1), dot(d2, g2), dot(d3, g3), dot(d4, g4)); vec3 derivative = -8.0 * mat4x3(d1, d2, d3, d4) * (aa * a * extrapolations) + mat4x3(g1, g2, g3, g4) * aaaa; return vec4(derivative, dot(aaaa, extrapolations)); } vec4 bccNoiseDerivatives_XYBeforeZ(vec3 X) { mat3 orthonormalMap = mat3( 0.788675134594813, -0.211324865405187, -0.577350269189626, -0.211324865405187, 0.788675134594813, -0.577350269189626, 0.577350269189626, 0.577350269189626, 0.577350269189626); X = orthonormalMap * X; vec4 result = bccNoiseDerivativesPart(X) + bccNoiseDerivativesPart(X + 144.5); return vec4(result.xyz * orthonormalMap, result.w); }const float PI = 3.14159265359;mat2 rot(float a) { return mat2(cos(a),-sin(a),sin(a),cos(a)); } void main() { vec3 vertexPosition = aVertexPosition; vec2 textureCoord = (vertexPosition.xy+1.) / 2.; vec2 pos = vec2(0.5, 0.5) + mix(vec2(0), (uMousePos-0.5), 0.00); vec2 st = vec2(textureCoord.x * uResolution.x/uResolution.y, textureCoord.y) - pos; st = rot(0.01 * -1. * 2.0 * PI) * (st); vec4 noise = bccNoiseDerivatives_XYBeforeZ(vec3(st * vec2(0.50, 1. - 0.50) * 9. * 0.27, 0.00 + uTime*0.02)); st.xy = mix(textureCoord, (noise.xy/7. + 0.5), 0.33); gl_Position = uPMatrix * uMVMatrix * vec4(vertexPosition, 1.0); vTextureCoord = (uTextureMatrix * vec4(st, 0.0, 1.0)).xy; vVertexPosition = vec3(aTextureCoord, 0.); }"],"data":{"depth":false,"uniforms":{}}},{"breakpoints":[{"name":"Desktop","min":992,"max":null,"props":{"gradient":0.6,"pos":{"type":"Vec2","_x":0.5,"_y":-0.19},"frequency":0.15,"distortion":0.18,"speed":0.1}},{"min":576,"name":"Tablet","max":991,"props":{"speed":0.07}}],"visible":true,"aspectRatio":1,"layerType":"effect","type":"blinds","speed":0.1,"trackMouse":0,"mouseMomentum":0,"animating":true,"isMask":0,"compiledFragmentShaders":["#version 300 es\nprecision highp float; in vec2 vTextureCoord;uniform sampler2D uTexture; uniform float uTime;uniform vec2 uMousePos; uniform vec2 uResolution;float ease (int easingFunc, float t) { return t; }const float STEPS = 10.0; const float PI = 3.14159265359;mat2 rot(float a) { return mat2(cos(a), -sin(a), sin(a), cos(a)); }vec2 scaleAspect(vec2 st, float aspectRatio) { return st * vec2(aspectRatio, 1.0); }vec2 unscaleAspect(vec2 st) { float aspectRatio = uResolution.x / uResolution.y; return st * vec2(1.0/aspectRatio, 1.0); }vec2 rotate(vec2 st, float angle) { float s = sin(angle); float c = cos(angle); mat2 rot = mat2(c, -s, s, c); return rot * st; }struct StructFunc { vec2 st; vec3 distort; };StructFunc style4(vec2 st, vec2 pos, float divisions, float dist, float amount, vec3 first, vec3 second, vec3 third) { vec2 diff = st - pos; float radius = length(diff); float segment = fract(radius * divisions - uTime * 0.01); vec3 distort = mix(mix(first, second, segment * 2.), mix(second, third, (segment - 0.5) / (1. - 0.5)), step(0.5, segment)); st -= pow(distort.r, dist) / 10. * amount * normalize(diff); st += pow(distort.b, dist) / 10. * amount * normalize(diff);st = rot(0.12 * 2. * PI) * (st - pos) + pos; st = unscaleAspect(st);return StructFunc(st, distort); }StructFunc getStyle(vec2 st, vec2 pos, float divisions, float dist, float amount, vec3 first, vec3 second, vec3 third) { return style4(st, pos, divisions, dist, amount, first, second, third); }vec4 blinds(vec2 st, float mDist) { float aspectRatio = uResolution.x / uResolution.y; vec2 pos = vec2(0.5, 1.19) + mix(vec2(0), (uMousePos - 0.5), 0.00) * floor(1.00); pos = scaleAspect(pos, aspectRatio); st = scaleAspect(st, aspectRatio);st = rotate(st - pos, -1. * 0.12 * 2.0 * PI) + pos;vec3 first = vec3(1, 0, 0); vec3 second = vec3(0, 1, 0); vec3 third = vec3(0, 0, 1); float divisions = 2. + 0.15 * 30.; float dist = 0.18 * 4. + 1.; float amount = 0.60 * mDist;StructFunc result = getStyle(st, pos, divisions, dist, amount, first, second, third); vec4 color = texture(uTexture, result.st);return color; }out vec4 fragColor;void main() { vec2 uv = vTextureCoord; float aspectRatio = uResolution.x / uResolution.y;vec2 mPos = vec2(0.5, 1.19) + mix(vec2(0), (uMousePos - 0.5), 0.00); vec2 pos = mPos; float mDist = ease(0, max(0., 1. - distance(uv * vec2(aspectRatio, 1), mPos * vec2(aspectRatio, 1)) * 4. * (1. - 1.00)));vec4 col = blinds(uv, mDist); fragColor = col;}"],"compiledVertexShaders":["#version 300 es\nprecision highp float;in vec3 aVertexPosition; in vec2 aTextureCoord;uniform mat4 uMVMatrix; uniform mat4 uPMatrix; uniform mat4 uTextureMatrix;out vec2 vTextureCoord; out vec3 vVertexPosition;void main() { gl_Position = uPMatrix * uMVMatrix * vec4(aVertexPosition, 1.0); vTextureCoord = (uTextureMatrix * vec4(aTextureCoord, 0.0, 1.0)).xy; }"],"data":{"depth":false,"uniforms":{}}},{"breakpoints":[],"visible":true,"aspectRatio":1,"layerType":"effect","type":"dither","speed":0.5,"animating":false,"mouseMomentum":0,"isMask":0,"compiledFragmentShaders":["#version 300 es\nprecision highp float;in vec3 vVertexPosition; in vec2 vTextureCoord;uniform sampler2D uTexture;uniform float uTime;const int MAX_LEVEL = 4;float random(vec2 seed) { vec3 p3 = fract(vec3(seed.xyx) * 0.1031); p3 += dot(p3, p3.yzx + 33.33); return fract((p3.x + p3.y) * p3.z); }float getRandNoise(vec2 st, vec2 offset) { vec3 p3 = fract(vec3((st + offset).xyx) * 0.1031); p3 += dot(p3, p3.yzx + 33.33); return fract((p3.x + p3.y) * p3.z) + 0.001; }vec3 dither(vec3 color, vec2 st) { float delta = floor(uTime); vec2 offset = vec2(random(vec2(123,16) + delta), random(vec2(56,96) + delta)); float noise = 0.0; noise = getRandNoise(st, offset); color += (noise - 0.505) * 0.50; return round(color * (1.0 / 0.50)) * 0.50; }out vec4 fragColor;void main() { vec2 uv = vTextureCoord; float delta = floor(uTime); vec4 color = texture(uTexture, uv);if(color.a == 0.) { fragColor = vec4(0); return; }color.rgb = mix(color.rgb, dither(color.rgb, gl_FragCoord.xy), 0.32); fragColor = color;}"],"compiledVertexShaders":["#version 300 es\nprecision highp float;in vec3 aVertexPosition; in vec2 aTextureCoord;uniform mat4 uMVMatrix; uniform mat4 uPMatrix; uniform mat4 uTextureMatrix;out vec2 vTextureCoord; out vec3 vVertexPosition;void main() { gl_Position = uPMatrix * uMVMatrix * vec4(aVertexPosition, 1.0); vTextureCoord = (uTextureMatrix * vec4(aTextureCoord, 0.0, 1.0)).xy; }"],"data":{"depth":false,"uniforms":{},"texture":{"src":"https://assets.unicorn.studio/media/blue_noise_med.png","sampler":"uBlueNoise"}}}],"options":{"name":"BG from top center","fps":30,"dpi":1.5,"scale":1,"includeLogo":false,"isProduction":false,"freePlan":false},"version":"1.3.2","id":"UoU6tCsTzJZXfkwww1zf"}