README-en
Last updated
Last updated
3️⃣ A curated list of awesome ThreeJS resources
Or you can reach me on Twitter:
: A must-read book to be comfortable with 3D maths. by &
: A reference in term of PBR concepts. A gold mine. by , &
: Amazing book by a very funny author about a bunch of stuff to make experiences more natural based on the Processing language by
: A great course accessible for the most beginner programmer who wants to learn how to make ThreeJS 3D experiences from scratch. by
by
: A reference on the road to master shaders. And it's free. by
: Documentation on GLSL
: A very comprehensive article on homogeneous coordinates and projective geometry (To finally understand what is the 4th coordinate (w) in your vertex shaders)
: A comprehensive article about MeshSurfaceSampler
: A good article to learn how to add a fake depth to a 2D image in ThreeJS.
: A limpid tutorial to understand shader projection, view and model matrices (visually impactful)
Clever approach to caustics rendering
Awesome article for the ones that want to create truly realistic water
: Really awesome evolutive tutorial to acquire some knowledge on Generative Art by &
: Visual search engine by keyword or picture (a bit like Pinterest)
: Good source of inspiration
: Prepare to be blown away by this shader sharing platform.
: Some awesome videos about ShaderShop and more. by
: Assets for 3D artists (Textures, Models, HDRI)
: Public CC0 3D Asset Library (Textures, Models, HDRI)
: Free PBR textures with Diffuse, Normal, Displacement, Occlusion, Specularity and Roughness Maps.
: Digital textures for 3D rendering and real-time use.
: - CC0 textures for Physically Based Rendering
: A useful set of signal shaping patterns (to convert into GLSL) by
: Awesome set of shaping functions for shaders by
: A quick reminder on how to make some signal patterns by
: Noises coded by others so you can use them directly in your shaders for cool effects (included: Perlin noises)
There are also some links with explanation of the approach
: This is a tarot deck for learning GLSL shaders. Each PixelSpirit card has a visual element and its GLSL shader code. The cards are ordered from simplest to most complex, building a library of code functions that combine like a book of spells to form an infinite visual language. by
Library associated with the PixelSpirit Elemens Deck by
: Node-based WebGL design tool, used for procedural geometry, particles, materials and animation.
: Free and powerful to create your own 3D assets. A lot of export file extensions are available.
: To create procedural 3D assets. The free licence "Houdini Apprentice" can be used to learn (no commercial usage)
: A promising tool for 3D modeling, collaboratively.
: A tool to convert your HDRI file into a Cube map that can be load as a CubeTexture in ThreeJS. by
: Powerful tool to wrap your head around and test shaping signals in GLSL by
: Visually impactful editor to work on shaping signals, by drag and dropping patterns. (Mindblowingly awesome) by
: Console-based GLSL Sandbox for 2D/3D shaders by . Battle-tested by its creator, it enables to build a creative pipeline agnostic to the target platform and to iterate very fast and with less frictions for making a draft of your shaders ideas. A must-have in your toolkit.
: Sandbox to experiment and share with people. ThreeJS template can be easily found.
: Found it hard to configure for ThreeJS x Typescript, but a good sandbox to try out new things.
: A nice tool to, for example, try out your Blender exports and how they will react in ThreeJS.
: Easy tool to host your projects, and free for a personal/hobbyist type of projects.
: a granular and multi-language shader library designed for performance and flexibility by . A cross platform library that will help you iterate on your shaders very easily. Going deep in the code of a specific functionality can also help you learn GLSL/HLSL.
: A declarative way of handling your ThreeJS stuff for React by
: Useful helpers for react-three-fiber by
: Declarative ThreeJS inspired by r3f for the Angular ecosystem by
: The equivalent of r3f for VueJS by
: A three.js component library for Svelte.
: Declarative ThreeJS for Svelte by
by
by
by : Highly effective way to check for collisions and to accelerate raycasting by the usage of bounding volume hierarchy. (Really a must have in your toolkit)
by : A flexible, memory compact, fast and dynamic CSG implementation on top of three-mesh-bvh. (Amazing tool to perform some Boolean operations between meshes like intersection, difference, ...)
Useful library with tons of settings
Three.js plugin for navigation
Easy to use steering library
A complete character skinning & animation library for the web
Library for procedural character generation. Armature included
Fast Fourier Transform ocean rendering for Three.js
Marvellous project with realistic water interaction
Demo project that shows water ripple effect
AABB based collision detection
: Forum where you can ask your questions ( be sure to search well before)
Contributions welcome! Read the first.
- A curated list of awesome GLSL resources.
- A curated list of awesome WebGL libraries, resources and much more.
- A curated list of awesome WebGPU resources.
- A curated list of awesome OpenGL libraries, debuggers and resources.
- A carefully curated list of awesome creative coding resources primarily for beginners/intermediates.
- A curated list of awesome computer vision resources.
- A curated list of awesome Vulkan projects and ecosystem.
- A awesome list about game development.
- A list of graphic programming resources.