What tools do you use to create shaders for your three.js projects?



¡ hello all!

I am seeking for advices and opinions those badass enough to write their own shaderMaterials might want to share in regards to what dev environment should one adopt to create shaders specifically for three.js.

The tools I found while researching on this topic which seemed the most interresting to me are:

  • Shdr (Chrome App)
  • Fragment (Win&Mac software)
  • Shader Editor (Chrome Extension)

Although I never really used them yet.

Any insights on this topic, relevant ressources and better ways to implement shaders inside the main code would be of great help!




Shdr looks kind of cool. However I would suggest that when you are just starting out, don’t use any tool except for a text editor.

Fancy tools are generally just distractions when you are learning the basics. Get to grips with those first and then see what tools will be useful for your workflow.


I’m using Atom and the language plugin for GLSL. This combination works pretty well for me.

There is also a Shader preview plugin for Atom but I have not tested it so far.