Setup Post Processing
<model-viewer-effects> library addon for
you with a easy-to-use postprocessing workflow for spicing up your models.
The list of currently support effects is: SMAA, FXAA, Pixelate, Outline, Glitch, SSAO, Bloom (Global/Selective), and Color Grade.
In order to avoid package collisions, you will be required to add an import-map for the Three.js package, and use the module version of
Safari does not support
import maps, the following script will make your code work universally:
Three.js from any cdn - cdnjs, unpkg, or jsdelivr:
Now import the
<model-viewer> module version which doesn't package three, and the
Setting up post-processing effects is as simple as adding an
<effect-composer> component inside your
From here, simply add any of the supported effects inside the
See the API Reference for a list of all supported effects.