diff --git a/src/lights/HemisphereLight.js b/src/lights/HemisphereLight.js
index 8bd15c8..4cb88ab 100644
--- a/src/lights/HemisphereLight.js
+++ b/src/lights/HemisphereLight.js
@@ -1,15 +1,15 @@
 import { HemisphereLight } from 'three';
+import { watch } from 'vue';
 import Light from './Light.js';
-import { bindProp } from '../tools.js';
 
 export default {
   extends: Light,
   props: {
-    groundColor: { type: String, default: '#ffffff' },
+    groundColor: { type: String, default: '#444444' },
   },
   created() {
     this.light = new HemisphereLight(this.color, this.groundColor, this.intensity);
-    bindProp(this, 'groundColor', this.light);
+    watch(() => this.groundColor, (value) => { this.light.groundColor.set(value); });
     this.initLight();
   },
   __hmrId: 'HemisphereLight',
diff --git a/src/lights/Light.js b/src/lights/Light.js
index 75b61f0..8b9151f 100644
--- a/src/lights/Light.js
+++ b/src/lights/Light.js
@@ -11,6 +11,7 @@ export default {
     intensity: { type: Number, default: 1 },
     castShadow: { type: Boolean, default: false },
     shadowMapSize: { type: Object, default: { x: 512, y: 512 } },
+    shadowCamera: { type: Object, default: {} },
   },
   // can't use setup because it will not be used in sub components
   // setup() {},
@@ -26,12 +27,13 @@ export default {
       if (this.light.shadow) {
         this.light.castShadow = this.castShadow;
         setFromProp(this.light.shadow.mapSize, this.shadowMapSize);
+        setFromProp(this.light.shadow.camera, this.shadowCamera);
       }
 
       ['color', 'intensity', 'castShadow'].forEach(p => {
         watch(() => this[p], () => {
           if (p === 'color') {
-            this.light.color = new Color(this.color);
+            this.light.color.set(this.color);
           } else {
             this.light[p] = this[p];
           }