JS/CSS Canvas Webcam Grayscale SRC

<style>
video{
filter: grayscale(100%);
}
</style>
<center>
<body bgcolor="black">
<video id="video" width="500" height="500" autoplay></video>
<canvas id="canvas" width="500" height="500"></canvas>
</center>
<script>
var canvas = document.getElementById('canvas');
var context = canvas.getContext('2d');
var video = document.getElementById('video');
var mediaConfig = {video:true,audio:true};
navigator.mediaDevices.getUserMedia(mediaConfig).then(function(stream) {
video.src = window.URL.createObjectURL(stream);
video.play();
});
</script>