JavaScript Shaders

Open-source JavaScript projects categorized as Shaders
Edit details
Glsl Webgl JavaScript Shadertoy Threejs
InfluxDB – Built for High-Performance Time Series Workloads
InfluxDB 3 OSS is now GA. Transform, enrich, and act on time series data directly in the database. Automate critical tasks and eliminate the need to move data externally. Download now.
www.influxdata.com
featured

Top 22 JavaScript Shader Projects

Shaders

  1. Burn-My-Windows

    đŸ”Ĩ Disintegrate your windows with style.

    Project mention: Animated Cursors | news.ycombinator.com | 2025-07-25

    If you'd like to scratch that itch... https://github.com/Schneegans/Burn-My-Windows

  2. Sevalla

    Deploy and host your apps and databases, now with $50 credit! Sevalla is the PaaS you have been looking for! Advanced deployment pipelines, usage-based pricing, preview apps, templates, human support by developers, and much more!

    Sevalla logo

  3. glslEditor

    Simple WebGL Fragment Shader Editor

  4. glslCanvas

    Simple tool to load GLSL shaders on HTML Canvas using WebGL

  5. curtainsjs

    curtains.js is a lightweight vanilla WebGL javascript library that turns HTML DOM elements into interactive textured planes.

  6. shader-park-core

    A JavaScript library for creating real-time 2D and 3D shaders. JS -> Shader. https://shaderpark.com/ https://twitter.com/shaderpark

  7. shader-doodle

    A friendly web-component for writing and rendering shaders.

    Project mention: Show HN: Svader – Create GPU-rendered Svelte components | news.ycombinator.com | 2024-12-14

  8. vite-plugin-glsl

    :spider_web: Import, inline (and minify) GLSL/WGSL shader files :electric_plug:

  9. InfluxDB

    InfluxDB – Built for High-Performance Time Series Workloads. InfluxDB 3 OSS is now GA. Transform, enrich, and act on time series data directly in the database. Automate critical tasks and eliminate the need to move data externally. Download now.

    InfluxDB logo

  10. three-csm

    ☀ī¸ Cascaded shadow maps (CSMs) implementation for Three.js

  11. webgpu-compute-rasterizer

    A simple software rasterizer running on a WebGPU compute shader. Built for educational purposes.

  12. shader-web-background

    Displays GLSL fragment shaders as a website background. Supports offscreen buffers and floating point textures on almost any browser and hardware. Compatible with Shadertoy.

  13. retrace.gl

    Create, ray trace & export programatically defined Signed Distance Function CSG geometries with an API suited for generative art - in your browser! 🎉

  14. rain

    Rainy window wallpaper (by rocksdanister)

  15. shadertoy-react

    6kB "Shadertoy" like react component letting you easily render your fragment shaders in your React web projects, without having to worry about implementing the WebGL part.

  16. particular-drift

    Turn images into flowing particle animations. Built with js, webgl / glsl, and html5 canvas

    Project mention: Show HN: Creating flowing particle animations out of images (JS and WebGL) | news.ycombinator.com | 2025-01-29

    Hi! I'm Alan, and I built a website that turns images into flowing particle animations.

    This javascript / WebGL tool creates particle animations out of any image in real-time within the browser, with particles that dynamically respond to edge detection and flow fields.

    It uses Sobel edge detection, a Perlin noise flow field, and webGL / GLSL for better performance.

    The tool is completely free and open source (MIT license).

    Github repo: https://github.com/collidingScopes/particular-drift

    Let me know of any feedback or suggestions for improvement.

  17. webpack-glsl-loader

    A webpack loader for glsl shaders - includes support for nested imports.

  18. langterm

    🕹ī¸ WebGL-based VT220 emulator, made as a learning example and frontend for a text adventure

  19. Tokenmagic

    A Foundry VTT module that allows you to add animations and graphic effects to tokens, tiles, templates and drawings.

  20. js-shaders

    CPU rendered ASCII art shader writing tool with hot reloading.

  21. mathematical-sculptures

    Generate custom parametric surfaces ✒ī¸đŸ’ 

  22. clouds

    Clouds wallpaper (by rocksdanister)

  23. threejs-upscaler

    Simple realtime rendering upscaler for your projects. This plugin may be used for performance optimization.

    Project mention: Writing a plugin for upscaling rendering under ThreeJS | dev.to | 2024-09-01

    You can view the full source of this tutorial at GitHub: https://github.com/DevsDaddy/threejs-upscaler

  24. webgl-mipmaps-explainer

    explore mipmap and anisotropic filtering options in webgl2

  25. SaaSHub

    SaaSHub - Software Alternatives and Reviews. SaaSHub helps you find the best software and product alternatives

    SaaSHub logo
NOTE: The open source projects on this list are ordered by number of github stars. The number of mentions indicates repo mentiontions in the last 12 Months or since we started tracking (Dec 2020).

JavaScript Shaders discussion

Log in or Post with

JavaScript Shaders related posts

  • Show HN: Svader – Create GPU-rendered Svelte components

    4 projects | news.ycombinator.com | 14 Dec 2024

  • Building a Compute Bezier Quad Rasterizer with WebGPU

    2 projects | /r/webgpu | 27 May 2023

  • Pf2e Beginner box, how to make tokens more vibrant?

    2 projects | /r/FoundryVTT | 8 Mar 2023

  • How do YOU handle creature tokens that are no longer a threat?

    1 project | /r/FoundryVTT | 23 Feb 2023

  • What did they use?

    2 projects | /r/AskProgramming | 27 Oct 2022

  • Spell templates

    1 project | /r/FoundryVTT | 13 Oct 2022

  • [OC] We're facing one of the BBEGs in our campaign, so I drew and animated her token for her first phase! Here's the result. I just adore how animations work in FVTT

    1 project | /r/FoundryVTT | 26 Aug 2022
  • A note from our sponsor - InfluxDB
    www.influxdata.com | 1 Sep 2025
    InfluxDB 3 OSS is now GA. Transform, enrich, and act on time series data directly in the database. Automate critical tasks and eliminate the need to move data externally. Download now. Learn more →

Index

What are some of the best open-source Shader projects in JavaScript? This list will help you:

# Project Stars
1 Burn-My-Windows 2,852
2 glslEditor 2,478
3 glslCanvas 2,127
4 curtainsjs 1,753
5 shader-park-core 798
6 shader-doodle 569
7 vite-plugin-glsl 380
8 three-csm 319
9 webgpu-compute-rasterizer 255
10 shader-web-background 244
11 retrace.gl 196
12 rain 176
13 shadertoy-react 127
14 particular-drift 117
15 webpack-glsl-loader 95
16 langterm 84
17 Tokenmagic 56
18 js-shaders 43
19 mathematical-sculptures 28
20 clouds 8
21 threejs-upscaler 8
22 webgl-mipmaps-explainer 1

Sponsored
Deploy and host your apps and databases, now with $50 credit!
Sevalla is the PaaS you have been looking for! Advanced deployment pipelines, usage-based pricing, preview apps, templates, human support by developers, and much more!
sevalla.com
Loading...