Vignette

A vignette effect.

import { Vignette } from '@react-three/postprocessing'
import { BlendFunction } from 'postprocessing'

return (
  <Vignette
    offset={0.5} // vignette offset
    darkness={0.5} // vignette darkness
    eskil={false} // Eskil's vignette technique
    blendFunction={BlendFunction.NORMAL} // blend mode
  />
)

Example

Vignette Demo
Vignette Demo

Props

NameTypeDefaultDescription
eskilBooleanfalseEnables Eskil's vignette technique.
blendFunctionBlendFunctionBlendFunction.NORMALThe blend function of this effect.
offsetNumber0.5The vignette offset.
darknessNumber0.5The vignette darkness.