Inigo Quilez :: computer graphics, mathematics, shaders, fractals, demoscene and more
Articles on computer graphics, math and art
Three Learning
How to Learn ThreeJS
My most liked resources to get started.
-make-a-button.png?width=92&height=&ar=&mode=&format=avif&dpr=2)
How to (not) make a button - Tomas Pustelnik's personal website
How to properly turn a div into a button, so the result will be accessible and useable by everyone.TLDR: Use a native button.
ThreeJS Light and shadow
Exploring the best ways to create light and shadows in ThreeJS
Using Three.js with GSAP ScrollTrigger | Frontend Horse | Creative Web Development
Learn the creative parts of HTML, CSS, and JavaScript. Let's make the frontend fun again!
(Unity) Better Minimal WebGL Template by Sean
The package is quite simple.™
Ripples, waves and fakes
Finding simple ways to to fake ripple and water effects.
Catalog
Introducing Catalog: Secure. Trustless. All from one place.
Olivier Larose's blog - All Tutorials
Here's a list of all the web animations tutorials we've done so far. From Awwwards website to CSS awards websites, we like to reverse engineer the most creative animations.
Painting with Math: A Gentle Study of Raymarching - Maxime Heckel's Blog
A compilation of my Raymarching and Signed Distance Field learnings and work. In it, I teach you how to leverage those techniques along with lighting models, smoothmin, soft shadows, and some math to create beautiful 3D raymarched scenes ranging from abstract shapes to infinite realistic-looking landscapes.
Moebius-style post-processing and other stylized shaders - Maxime Heckel's Blog
A detailed essay on the process of building a post-processing stylized shader reproducing the style of legendary artist Jean Giraud a.k.a Moebius for your React Three Fiber projects. In it, I detail the process of drawing outlines with a Sobel Filter as well as custom shadow and lighting patterns to bring a unique style to your WebGL scene.