diff --git a/app/assets/stylesheets/pages/_contacts.scss b/app/assets/stylesheets/pages/_contacts.scss
index a897fcf..96b9436 100644
--- a/app/assets/stylesheets/pages/_contacts.scss
+++ b/app/assets/stylesheets/pages/_contacts.scss
@@ -73,7 +73,7 @@ a:hover {
 
 .video-content {
   height: 485px;
-  background-color: black;
+  // background-color: black;
 }
 
 .half {
diff --git a/app/javascript/packs/local_video.js b/app/javascript/packs/local_video.js
new file mode 100644
index 0000000..6b5f98f
--- /dev/null
+++ b/app/javascript/packs/local_video.js
@@ -0,0 +1,14 @@
+const contactsVideo = document.getElementById("contacts-video")
+
+try {
+  const contactsStream = navigator.mediaDevices.getUserMedia({
+    audio: false,
+    video: true
+  }).then(stream => {
+    contactsVideo.srcObject = stream;
+    contactsVideo.muted = true;
+  })
+} catch(e) {
+  console.error(e);
+  contactsVideo.innerHTML = "Unable to getUserMedia()";
+}
diff --git a/app/views/pages/index.html.erb b/app/views/pages/index.html.erb
index a9edc98..060cad6 100644
--- a/app/views/pages/index.html.erb
+++ b/app/views/pages/index.html.erb
@@ -15,7 +15,7 @@
     </div>
     <div class="video-feed half">
       <div class="video-content">
-        <!-- <video id="contacts-video" autoplay=""></video> -->
+        <video id="contacts-video" autoplay=""></video>
       </div>
     </div>
   </div>
@@ -29,5 +29,6 @@
 </form>
 
 <%= javascript_pack_tag 'notifications' %>
+<%= javascript_pack_tag 'local_video' %>