Fx Shader - Xukmi
// ========================================== // XUKMI FX SHADER - COMPLETE PIECE // ========================================== // A vibrant, flowing, psychedelic fragment shader // with distortion, color cycling, and dynamic patterns. // Designed to be used as a full-screen effect or on any quad. // ==========================================
void main() { v_uv = a_texCoord; gl_Position = vec4(a_position, 0.0, 1.0); } #endif xukmi fx shader
uniform float u_time; // Time in seconds uniform vec2 u_resolution; // Screen resolution uniform vec2 u_mouse; // Mouse position (normalized 0-1) Pass the u_time , u_resolution , and u_mouse uniforms
// ------------------------------ // Main pattern generation // ------------------------------ void main() { // Aspect-correct UVs (centered, range ~[-1,1] with aspect) vec2 uv = v_uv; float aspect = u_resolution.x / u_resolution.y; vec2 st = uv * 2.0 - 1.0; st.x *= aspect; // Mouse influence (if mouse not moved, defaults to center) vec2 mouse = u_mouse; if (mouse.x == 0.0 && mouse.y == 0.0) mouse = vec2(0.5); vec2 mouseNorm = (mouse * 2.0 - 1.0); mouseNorm.x *= aspect; // ----- DISTORTION FIELDS ----- // Organic warping using sine/cosine of time and position float time = u_time * 0.8; vec2 q = st; q.x += sin(st.y * 3.0 + time) * 0.12; q.y += cos(st.x * 2.5 + time * 1.3) * 0.12; q += vec2(sin(time * 0.7), cos(time * 0.5)) * 0.08; // Secondary distortion layer vec2 r = st; r.x += sin(st.y * 5.0 - time * 1.8) * 0.08; r.y += cos(st.x * 4.0 + time * 1.2) * 0.08; // ----- PATTERN 1: Swirling tunnels ----- float angle = atan(q.y, q.x); float radius = length(q) * 1.5; float tunnel1 = sin(radius * 12.0 - time * 4.0) * 0.5 + 0.5; float tunnel2 = sin(angle * 6.0 + time * 2.0 + radius * 8.0) * 0.5 + 0.5; float swirl = sin(radius * 15.0 - angle * 3.0 - time * 3.0) * 0.6 + 0.4; // ----- PATTERN 2: Cellular / Voronoi-like noise ----- vec2 grid = fract(r * 4.0 + 0.5); vec2 gridId = floor(r * 4.0); float n = random(gridId); float cell = smoothstep(0.2, 0.8, sin(grid.x * 3.14159 * 2.0 + n * 10.0)) * smoothstep(0.2, 0.8, cos(grid.y * 3.14159 * 2.0 + n * 8.0)); // ----- PATTERN 3: Ripples from mouse ----- vec2 toMouse = st - mouseNorm; float distToMouse = length(toMouse); float ripple = sin(distToMouse * 20.0 - time * 12.0) * exp(-distToMouse * 3.0); ripple += 0.5 * sin(distToMouse * 45.0 + time * 8.0) * exp(-distToMouse * 4.0); // ----- PATTERN 4: Scanlines and grain ----- float scanline = sin(st.y * u_resolution.y / 8.0 + time * 8.0) * 0.15; float grain = random(st + floor(time * 30.0)) * 0.1; // ----- COMBINE PATTERNS ----- float intensity = 0.0; intensity += tunnel1 * 0.6; intensity += tunnel2 * 0.5; intensity += swirl * 0.7; intensity += cell * 0.4; intensity += ripple * 0.5; intensity += scanline; intensity += grain; // Add mouse interactive warp: intensity changes near cursor intensity += 0.3 * sin(distToMouse * 35.0 - time * 15.0) * exp(-distToMouse * 5.0); // Clamp and shape intensity intensity = clamp(intensity * 1.2, 0.0, 1.0); // ----- COLOR GENERATION (psychedelic) ----- // Hue shifts over space and time float hue = fract( angle * 0.8 + radius * 1.2 + time * 0.2 + intensity * 0.5 + cell * 0.3 + ripple * 0.4 ); // Saturation: vibrant, modulated by patterns float sat = 0.7 + swirl * 0.3 + tunnel2 * 0.2; // Value / Brightness: punchy float val = 0.6 + intensity * 0.6 + ripple * 0.3; vec3 hsv = vec3(hue, sat, val); vec3 color = hsv2rgb(hsv); // ----- ADDITIONAL GLOW & FX ----- // Add a subtle RGB split (chromatic aberration) vec3 colorShift; colorShift.r = hsv2rgb(vec3(fract(hue + 0.05), sat, val)).r; colorShift.g = color.g; colorShift.b = hsv2rgb(vec3(fract(hue - 0.05), sat, val)).b; color = mix(color, colorShift, 0.3); // Edge darkening (vignette) float vignette = 1.0 - length(st * 0.8) * 0.5; color *= vignette; // Add a bright center flash based on mouse proximity float flash = pow(1.0 - clamp(distToMouse * 1.2, 0.0, 1.0), 2.0); color += vec3(0.8, 0.5, 1.0) * flash * 0.4 * (0.8 + 0.4 * sin(time * 20.0)); // Final gamma correction color = pow(color, vec3(1.0/2.2)); gl_FragColor = vec4(color, 1.0); } #endif To use this shader, you can load it into any environment that supports GLSL (like Shadertoy, Processing with shaders, Three.js, or OpenFrameworks). Pass the u_time , u_resolution , and u_mouse uniforms. The result is a constantly morphing, colorful abstract “xukmi” visual. Pass the u_time
// --- VERTEX SHADER --- // (Minimal pass-through with UV coordinates) #ifdef VERTEX attribute vec2 a_position; attribute vec2 a_texCoord; varying vec2 v_uv;
// ------------------------------ // Helper functions // ------------------------------ float random (vec2 st) { return fract(sin(dot(st.xy, vec2(12.9898,78.233))) * 43758.5453123); }
vec3 hsv2rgb(vec3 c) { vec4 K = vec4(1.0, 2.0 / 3.0, 1.0 / 3.0, 3.0); vec3 p = abs(fract(c.xxx + K.xyz) * 6.0 - K.www); return c.z * mix(K.xxx, clamp(p - K.xxx, 0.0, 1.0), c.y); }
