Skip to content
WebGL Shader Playground.
JavaScript GLSL HTML CSS
Branch: master
Clone or download

Latest commit

Fetching latest commit…
Cannot retrieve the latest commit at this time.

Files

Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
assets
css
export/export-template
js
.gitignore
CNAME
LICENSE
index.html
index.js
readme.md

readme.md

Shader Expo

License: GPL v3 GitHub last commit Maintenance

🌅 🌈

WebGL Shader Playground.

ShaderExpo is purely dependency free shader editor made in Raw WebGL API. Experiment with basic webgl shaders on the fly.

Checkout ShaderExpo Case Study

📁 Features

  • Rich CodeEditor
  • Simple CodeEditor
  • AutoCompletion
  • Live Editing
  • Basic Debugging

Auto Completion

AutoCompletion

Inline Errors

Inline-Errors

Basic Meshes

Basic-Meshes

Texture and Custom OBJ Model Loading

Texture-Model-Loading

Example Shaders

Example-Shaders


👔 Avialable Uniforms

Name Type Description
uWorldMatrix mat4 I don't know
uViewMatrix mat4 I don't know
uProjMatrix mat4 I don't know
uTime float current frame time
mouse vec2 mouse postion
resolution vec2 canvas width, height
viewPos vec3 camera position
texture sampler2D default diffuse texture

🎲 Third Party Libs

  • Ace

📝 TODO

  • Add 3D Models
  • More Shader Variables
  • Saving Shaders
  • OOP

Contributions are welcome.

Example Shaders are taken from https://glslsandbox.com

⭐️ Support the project by giving it a star ⭐️

:octocat: Author

Made with ❤️ and JavaScript

You can’t perform that action at this time.