aframe-chromakey-material

A chromakey material for green screen effects in A-Frame. Provided a color, this material will remove that color from the video or image source. Perfect for blockbuster hollywood effects in VR!

API

| Property | Description | Default Value | | -------- | ----------- | ------------- | | color | Color to key from source. This is a vec3 of rgb values. Default is greenish. | 0.1 0.9 0.2 |

Installation

Browser

Install and use by directly including the browser files:

  <script src="https://unpkg.com/aframe-chromakey-material/dist/aframe-chromakey-material.min.js"></script>

See this example for usage.

npm

Install via npm/yarn:

npm install aframe-chromakey-material

Then require and use.

import 'aframe';
import 'aframe-chromakey-material';

Credits

A big thanks to the prior research on chromakey shaders in WebGL and Three.js by: https://github.com/makc/makc.github.io/tree/master/three.js/chromakey https://github.com/hawksley/Threex.chromakey