Easy Game effectsAnimated

Damage pulse screen edge

The "you are hurt" effect: the edges of the screen glow blood red and pulse like a heartbeat, over the normal picture.

The target picture for the shader challenge "Damage pulse screen edge"
Recreate this picture. You pass at a 99% match, then try to write it in fewer characters than the par.

How this challenge works

You write a fragment shader that draws the picture above, live in your browser. A match bar shows how close you are, and the score combines accuracy, code size (the par is 851 characters in Unity (Built-in)) and GPU speed. Work in HLSL, GLSL, WGSL, Metal or Godot and export the result when you are done.

The numbers you need

Picture
scene(uv), from the Toolbox
Distance from the middle
e = length((uv - 0.5) * float2(aspect, 1.0))
Edge amount
smoothstep(0.25, 0.8, e)
Pulse
0.6 + 0.4 * sin(time * 4.0)
Mix
lerp(picture, float3(0.8, 0.0, 0.05), edge * pulse * 0.85)

Helper functions provided

The toolbox has: scene(). Add them above your frag function with one click.

Solve it in your language

Unity (Built-in), Unity (URP), Unreal, Shadertoy / WebGL, OpenGL (LWJGL, raylib), three.js, GameMaker, LÖVE (Lua), Godot, Apple (iOS, macOS), WebGPU / Bevy.

Start coding