A post processing library that provides the means to implement image filter effects for three.js.

License: Zlib

Language: JavaScript

Keywords: 2d-filter-effects, composer, effects, image-effects, image-processing, post-processing, real-time, three-js, webgl

Post Processing

Build status npm version Peer dependencies CDN

A post processing library that provides the means to implement image filter effects for three.js.

Extensive Demo · Sandbox · API Reference · Wiki


This library requires the peer dependency three.

npm install three postprocessing


Please refer to the usage example of three.js for information about how to setup the renderer, scene and camera.

import { Clock, PerspectiveCamera, Scene, WebGLRenderer } from "three";
import { BloomEffect, EffectComposer, EffectPass, RenderPass } from "postprocessing";

const composer = new EffectComposer(new WebGLRenderer());
const camera = new PerspectiveCamera();
const scene = new Scene();

const effectPass = new EffectPass(camera, new BloomEffect());
effectPass.renderToScreen = true;

composer.addPass(new RenderPass(scene, camera));

const clock = new Clock();

(function render() {




This library provides an EffectPass which automatically organizes and merges any given combination of effects. This minimizes the amount of render operations and makes it possible to combine many effects without the performance penalties of traditional pass chaining. Additionally, every effect can choose its own blend function.

Furthermore, all fullscreen render operations use a single triangle that fills the screen. Compared to using a quad, this approach harmonizes with modern GPU rasterization patterns and eliminates unnecessary fragment calculations along the screen diagonal which is especially beneficial for GPGPU passes and effects that use complex fragment shaders.

Performance Test

Included Effects

Custom Effects

If you want to learn how to create custom effects or passes, please check the Wiki.


Please refer to the contribution guidelines for details.


This library is licensed under the Zlib license.

The original code that this library is based on, was written by mrdoob and the three.js contributors and is licensed under the MIT license.

The noise and scanline effects incorporate code written by Georg Steinrohder and Pat Shearon which was released under the Creative Commons Attribution 3.0 License.

Project Statistics

Sourcerank 10
Repository Size 49.1 MB
Stars 413
Forks 48
Watchers 19
Open issues 4
Dependencies 23
Contributors 1
Tags 63
Last updated
Last pushed

Top Contributors See all

Raoul v. R.

Packages Referencing this Repo

A post processing library that provides the means to implement image filter effects for three.js.
Latest release 6.6.0 - Updated - 413 stars

Recent Tags See all

v6.6.0 August 09, 2019
v6.5.1 June 26, 2019
v6.5.0 June 01, 2019
v6.4.0 May 19, 2019
v6.3.3 May 11, 2019
v6.3.2 April 29, 2019
v6.3.1 April 27, 2019
v6.3.0 April 25, 2019
v6.2.2 April 22, 2019
v6.2.1 April 10, 2019
v6.2.0 April 10, 2019
v6.1.1 March 29, 2019
v6.1.0 March 29, 2019
v6.0.2 March 23, 2019
v6.0.1 March 04, 2019

Something wrong with this page? Make a suggestion

Last synced: 2019-08-09 21:26:59 UTC

Login to resync this repository