← Back to Technical Work
Stylized Fireball Shader - 1

Stylized Fireball Shader

Real-time procedural fireball effect in WebGL

Date December 2024
Tags
webglglsltypescript

Overview

A real-time procedural fireball shader built in WebGL/GLSL. Uses layered noise functions, distortion fields, and custom color ramps to create a stylized fire effect that runs entirely on the GPU.

Technique

The effect combines multiple octaves of 3D simplex noise with domain warping to create turbulent, flame-like motion. The color is mapped through a hand-tuned gradient from dark red cores through orange to bright yellow tips.