https://github.com/jsulpis/realtime-planet-shader

Realtime planet shader in WebGL
https://github.com/jsulpis/realtime-planet-shader

glsl shader webgl

Last synced: 4 months ago
JSON representation

Realtime planet shader in WebGL

• Host: GitHub
• URL: https://github.com/jsulpis/realtime-planet-shader
• Owner: jsulpis
• License: gpl-3.0
• Created: 2023-07-06T10:16:02.000Z (almost 3 years ago)
• Default Branch: main
• Last Pushed: 2023-11-27T18:38:45.000Z (over 2 years ago)
• Last Synced: 2025-07-20T16:42:20.783Z (11 months ago)
• Topics: glsl, shader, webgl
• Language: GLSL
• Homepage: https://jsulpis.github.io/realtime-planet-shader/earth/
• Size: 7.45 MB
• Stars: 373
• Watchers: 3
• Forks: 22
• Open Issues: 2
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

          
# Realtime planet shader in WebGL

## Procedural



  


  


  


  

  live demo






This is a GLSL fragment shader I originally made on [Shadertoy](https://www.shadertoy.com/view/Ds3XRl) when learning raymarching. Later I switched to analytic raycasting for better performance. It's made by raycasting simple spheres with a bunch of fbm noises used for the normals and colors, and a fake atmosphere computed with distance functions.

I wanted to display it on a web page so that I can make a nice GUI to tweak the uniforms. Here it is !

It runs at 60fps on my old low-end phone, so it should also be quite smooth on whatever device you have.




## Textures



  


  


  


  

  live demo






After the procedural version, I found a bunch of textures to display a realistic view of some planets of our solar system. Still with a few controls, and no quality setting because it should already run at full fps on most devices.

## Note

If you want a minimalist setup to render GLSL shaders on a canvas like this one, you can check out the [little study](https://github.com/jsulpis/webgl-libs-comparison) I made before this project.

## More renders