Command Palette

Search for a command to run...

Hectal
Back to the lesson: Topic 15.5 — Particles and Instanced Effects
3D Web · Example 1 of 2

Particles that hide each other

Pixel values are rounded to steps of 5. The sampled pixel is under the middle of the far (orange) particle, inside the near (blue) particle's square.

Sparks, dust and light beams are many small soft shapes. Draw them as one Points object or one InstancedMesh (one draw call), blend them additively, and stop them from writing depth, or they hide each other.

Change the code and press Run (Ctrl+Enter). Predict what will happen first, then break it on purpose and read what changes. Your edits are saved and match the lesson page.

Ready for more? This phase has 4 hands-on exercises with automatic checks.

Practice questions

Write the code in the editor, run it, then open the model answer to compare.

01

Make 500 seeded dust specks as one Points object that hide nothing.

02

Say why additive blending is a good fit for the headlight beam but not for fog.

Explain it without notes

01

Why can a near particle hide a far one even though the near one is almost transparent?

02

When do you pick Points, InstancedMesh and Sprite?

Particles that hide each other
Press Run to see the page.
idle

Console

Nothing logged yet.

Expected console output

normal blending, depthWrite true     pixel under the far particle: 55, 105, 125
normal blending, depthWrite false    pixel under the far particle: 245, 170, 115
additive blending, depthWrite false  pixel under the far particle: 255, 255, 235