aframe-chromakey-material

A chromakey material for A-Frame.

Usage no npm install needed!

<script type="module">
  import aframeChromakeyMaterial from 'https://cdn.skypack.dev/aframe-chromakey-material';
</script>

README

aframe-chromakey-material

Version License

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!

chasevr

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