pixel shader academy
A free web demo — play it in your browser, no install. Pixel Shader Academy — landing site. Learn GLSL fragment shaders, stage by stage. Demo: shader.dolstep.com
Vote and save it — continue with GitHub or sign in free
Made this, @bobddadoo? See how many people played it → or use email
GitHub asks to share your profile and email with us. We never post anything.
No account needed to save ♥ or react 🔥: they’re under the game. Or vote with email.
Open the live demo Source on GitHubFrom the README
Learn GLSL the way you learn a video game.
🎮 Play the Free Demo → · 🛒 Buy on itch.io → · 🌐 Landing site
Pixel Shader Academy is a browser-based, stage-by-stage GLSL fragment shader playground. Write code on the right, watch the preview on top, read the lesson on the left, hit Run (or Ctrl+Enter), and let the Check button compare your output against the reference solution.
No install. No toolchain. No Node, no Unity, no headaches. Open a tab and start writing shaders.
This repository is the public landing page for the project.
Built something like this? Submit your vibe — free account, takes a minute. How listing works.
More like this
allanhert portfolio
Personal site and WebGL Lab — Next.js, Three.js and custom GLSL: GPU reaction-diffusion, SDF raymarching, dithered shaders.
shaderflow
Visual node-based GLSL shader editor - design materials on a graph, compiled live to WebGL. React + React Flow + Three.js.
abyssal ocean
Real-time spectral FFT ocean in a single HTML file — WebGL2 + three.js, JONSWAP/TMA spectrum, 3 cascades, physical foam, caustics and underwater. No…
ribbon generator
Single-file 3D light-ribbon generator — Three.js + bloom, no build step. Exports 4K PNG, embeddable HTML, or clean-mode video.
vernier gl
Interactive drafting table in WebGL — draw a plan on an 8px grid, tilt the sheet, sculpt it in perspective. One fragment shader, zero dependencies…
- raymarchcity Audio-driven raymarched night city — the whole thing in one fragment shader. Drop in an mp3.
Made this?
Claim it: create a free account, then press CLAIM THIS in the cruiser. Put the badge below in your README or on your demo page first; that link is how we know it's yours.
Your project is on the cruise, loaded live from your own site. Put the badge in your README or on the demo page: it shows your live play count, it links back to this page, and everyone who lands here is one click from running the real thing.
