WebGL Examples

Creator

Creator

Created

Created

2020 Jul 1 6:40

Editor

Editor

Edited

Edited

2021 Sep 22 7:43

Refs

Refs

Example Set

20 Impressive Examples for Learning WebGL with Three.js

By now you have probably heard about Three.js - a library which makes working with 3D in the browser easy. In this article, you will find a collection of demos, tutorials and resources that will inspire you to learn more about the library.

20 Impressive Examples for Learning WebGL with Three.js

https://tutorialzine.com/2013/09/20-impressive-examples-for-learning-webgl-with-three-js

20 Impressive Examples for Learning WebGL with Three.js

All Experiments | Experiments with Google

Since 2009, coders have created thousands of amazing experiments using Chrome, Android, AI, WebVR, AR and more. We're showcasing projects here, along with helpful tools and resources, to inspire others to create new experiments.

All Experiments | Experiments with Google

https://experiments.withgoogle.com/experiments?tag=WebGL

All Experiments | Experiments with Google

Heavy Example

Lusion - Surface Floater

Surface Floater is an experiment created by Lusion Ltd. It is a WebGL artwork to demonstrate our creative coding workflow at Lusion

Lusion - Surface Floater

https://surface-floater.lusion.co/

Lusion - Surface Floater

Customize your car, explore it from all the angles, choose the color you want and fit the rims to your design! You can choose from the models we already did or suggest us what you would like to see and we will make it for you! Made by Plus360Degrees.

http://carvisualizer.plus360degrees.com/threejs/

Car Visualizer

Game Example

HexGL, the HTML5 futuristic racing game.

HexGL is a futuristic racing game built by Thibaut Despoulain (BKcore) using HTML5, Javascript and WebGL. Come challenge your friends on this fast-paced 3D game!

HexGL, the HTML5 futuristic racing game.

http://hexgl.bkcore.com/play/

HexGL, the HTML5 futuristic racing game.

About: PlanetMaker allows you to create and tweak your own planet using image textures, lighting, and more importantly, your imagination. Use of any images generated using PlanetMaker are free for your use in any medium. I just as that attribution accompany the image when used in articles or where possible.

http://planetmaker.wthr.us/

Meaningful Example

Interactive Globe: Small Arms Imports & Exports

This data visualization was produced by Google as part of the Google Ideas INFO (Illicit Networks, Forces in Opposition) Summit with support from the Igarape Institute and data provided by the Peace Research Institute Oslo (PRIO) small arms database.

http://armsglobe.chromeexperiments.com/

three.js css3d - periodic table

three.js css3d - periodic table

https://mrdoob.com/lab/javascript/threejs/css3d/periodictable/

WebGL Globe * Created by the Google Data Arts Team * Data acquired from SEDAC

http://globe.chromeexperiments.com/

Art Example

obsidian by xplsv

obsidian by xplsv

https://mrdoob.com/files/temp/xplsv_obsidian/

2D Example

Arcade Fire / Just a Reflektor

An interactive music video for "Reflektor" by Arcade Fire. Directed by Vincent Morisset. Created for Google Chrome.

Arcade Fire / Just a Reflektor

https://www.justareflektor.com/

Arcade Fire / Just a Reflektor

Recommendations

///////////