Scene with custom blend mode (difference/invert)

jep · August 15, 2020, 1:21am

Here is my production code:

gist.github.com

https://gist.github.com/jep-a/1974a47f98e11fb1179a709356d05a35

backdrop.js

import {throttle, debounce} from 'lodash'
import * as PostProcessing from 'postprocessing'
import * as Three from 'three'
import autobind from 'autobind-decorator'
import domtoimage from 'dom-to-image-more'
import MobileDetect from 'mobile-detect'

import * as config from '../config'
import * as util from '../util'
import StylesheetVariables from '../sass'

This file has been truncated. show original

I wrote a difference shader (lines 12-41) that takes in an inputBuffer (my background) and an overlayBuffer (the logo and frame). Pass setup is on lines 54-146.

Here is the page:

Topic		Replies	Views
Is there a way to blend with two 3d object without the background color Questions blending , blend-modes	1	987	April 22, 2020
My personal ThreeJS scenes gallery / portfolio made with React Showcase scenes	21	6580	June 9, 2023
Some issue with scene Questions scene	3	727	February 1, 2018
Three JS need to render two different scenes in two different canvas and need to hide show them on click of button Questions materials , geometry , webgl-renderer , canvas , scene	5	3344	June 27, 2020
Scene transparency Questions textures , materials , shaders	2	261	September 29, 2023

Scene with custom blend mode (difference/invert)

Related Topics